zoukankan      html  css  js  c++  java
  • CSS样式属性——背景

     背景——包括背景颜色、背景图片,以及背景图片的控制

        background-color:设置背景色(transparent表示透明的背景色)

        background-image:设置元素的背景图片    background-repeat:确定背景图片是否以及如何重复

                   no-repeat:只出现一次  repeat:在水平和垂直方向上重复  repeat-x和repeat-y分别在水平和垂直方向上重复

        background-attachment:确定背景图像是否跟随内容滚动(fixed表示固定,scroll表示图像跟随内容的移动而移动)

        background-position:指定背景图像的水平位置和垂直位置(水平:left,center,right,数值  垂直:top,center,bottom,数值)

      3个Div在同一区域分层:

        <head>

          <title></title>

          <style type="text/css">

            div{

              height:300px;

              300px;

            }

            div.div1{

              background-color:red;

              top:100px;

              left:100px;

              position:absolute;    //absolute表示绝对定位

              z-index:3;         //z-index值越高的显示在外面

            }

            div.div2{

              background-color:yellow;

              top:130px;

              left:130px;

              position:absolute;

              z-index:2;

            }

            div.div3{

              background-color:green;

              top:160px;

              left:160px;

              position:absolute;

              z-index:1;

            }

          </style>

        </head>

        <body>

          <div class="div1"></div>

          <div class="div2"></div>

          <div class="div3"></div>

        </body>

      右下角固定弹窗:

        <style type="text/css">

          .div1{

            right:0px;

            bottom:0px;

            background-color:yellow;

            position:fixed;

            height:250px;

            350px;

          }

        </style>

        ……

        <div class="div1"></div>

  • 相关阅读:
    Windows莫名内存到百分之百,需要修改虚拟内存
    idea中的springboot的maven项目报错Failed to clean project: Failed to delete D: ew_shunyishunyi argetshunyiWEB-INFclassesstatic
    VMware 启动虚拟机黑屏(Ubuntu)
    MySQL 8.0.18安装教程(windows 64位)
    ubunt中,使用命令su命令切换root账户,提示认证失败
    AngularJS 杂项知识点
    AngularJS $watch 性能杀手
    AngularJS controller as vm方式
    AngularJS 路由 resolve属性
    AngularJS $observe $watch
  • 原文地址:https://www.cnblogs.com/zhangchaoran/p/6803120.html
Copyright © 2011-2022 走看看