码迷,mamicode.com
首页 > 其他好文 > 详细

关于position的四个标签

时间:2018-10-27 17:40:14      阅读:125      评论:0      收藏:0      [点我收藏+]

标签:代码   位置   back   rgba   根据   20px   idt   窗口   abs   

四个标签是static,relative,absolute,fixed。

static 该值是正常流,并且是默认值,因此你很少看到(如果存在的话)指定该值。

relative:框的位置能够相对于它在正常流中的位置有所偏移

absolute:使用x和y坐标,根据包含元素的左上角精确地定位框的位置

fixed:位置是根据浏览器窗口的左上角计算出来的,并且即使用户滚动窗口,也不会改变位置。

 

部分源代码:

  html:

  <div class ="box" id="one">One</div>
   <div class ="box" id ="two"> Two</div>
  <div class ="box" id ="three"> Three </div>
  <div class ="box" id ="four">Four</div>

  css:

  

.box {
display:inline-block ;
height:100px;
width:100px;
background:rgba(255, 217, 0, 0.863);
color: rgba(255, 255, 255, 0.295);
}

#two {
position: relative;
top: 20px;
left: 20px;
background: rgba(255, 0, 212, 0.582);
}

关于position的四个标签

标签:代码   位置   back   rgba   根据   20px   idt   窗口   abs   

原文地址:https://www.cnblogs.com/alukade/p/9862358.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!