zoukankan      html  css  js  c++  java
  • 定位之相对定位

     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4 <meta charset="utf-8">
     5 <title></title>
     6 <style type="text/css">
     7 /*
     8 相对定位特点
     9 1.不会离文档流 占位 所有后面的元素不会往前跑
    10 2.可以设置上下左右四个方位
    11 如果同的设置了top和bottom值只有top起作用
    12 如果同时设置了1et和right值只有1eft起作用
    13 3.参照物:自已本身
    14 4.可以设置zinde属性z-ine越大越在上
    15 z-index必须要和定位元素(绝对,相利,固定)同时使用才起作用
    16 */
    17 .red{
    18 width: 300px;
    19 height: 300px;
    20 background-color: red
    21 }
    22 .green{
    23 width: 200px;
    24 height: 200px;
    25 background-color: green;
    26 
    27 position: relative;
    28 left: 50px;
    29 top: 50px;
    30 z-index: 10;
    31 }
    32 .blue{
    33 width: 100px;
    34 height: 100px;
    35 background-color: blue;
    36 position: relative;
    37 z-index: 11;
    38 }
    39 </style>
    40 </head>
    41 <body>
    42 <div class="red">
    43 <div class="green"></div>
    44 <div class="blue"></div>
    45 </div>
    46 </body>
    47 </html>
  • 相关阅读:
    wim文件位置
    用DISM++来管理wim当中的驱动
    交易所基金代码段
    systemd配置nginx
    MACD公式
    nginx配置
    linux的tmfps
    nohup&
    geth
    RGB
  • 原文地址:https://www.cnblogs.com/webaction/p/14251527.html
Copyright © 2011-2022 走看看