position 定位

/*#a{
    border:3px solid #0F9;
    height:100px;
    100px;
      margin:10px;
    background-color:#C39;
    right:0px;
    bottom:0px;
    position:fixed;
    }*/
    /*.b{
        border:3px solid blue;
     height:100px;
     100px;
     margin:10px;
     background-color:#0C3;
     left:50px;
     bottom:20px;
     position:absolute;
      }
     .c{
          border:2px solid red;
          400px;
          height:200px;}
    .d{
          border:2px solid red;
          400px;
          height:200px;
          position:relative;}*/
          .a{
              border:5px solid blue;
               height:100px;
               100px;
               margin:10px;
               background-color:#096;
               position:fixed;}
        .aa{
            border:5px solid blue;
               height:100px;
               100px;
               margin:10px;
               left:20px;
               top:70px;
               background-color:#096;
               position:relative}
      .c{
          border:3px solid #0F9;
          height:100px;
          100px;
          margin:10px;
          background-color:#C39;
          right:0px;
          top:0px;
          position:fixed;}
          .cc{
          border:3px solid #0F9;
          height:100px;
          100px;
          margin:10px;
          background-color:#C39;
          left:0px;
          top:0px;
          position:fixed;}
         
</style>
</head>

<body>
<br />
<br />
<br />
<br />
<br />
<br />
<br />


<div class="a">a</div><br />
<br />
<br />
<br />
<br />
<br />
<br />

<div class="aa">aa</div>
<div class="c">c</div>
<div class="cc">cc</div>

</body>
</html>

fixed 悬浮跟随浏览器边框的绝对定位

absolute 相对于浏览器边框或包含他的position 的绝对定位

relative 相对定位

原文地址:https://www.cnblogs.com/storm47/p/5321897.html