CCS基础 - position

Posted 王仲春的博客

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CCS基础 - position相关的知识,希望对你有一定的参考价值。

position属性的值如下:

1.absolute:生成绝对定位的元素,相对于当前元素的父元素中position为static之外的第一个元素进行定位

.box {
float:left;
border-style:dotted;
border-color:blue;
background-color:#bbb;
margin-right:2%;
margin-left:2%;//box的左侧盒最外层的width是其父元素中position为static之外的第一个元素的宽度的26%;
top:-30px;
width:16%;//box的width是其父元素中position为static之外的第一个元素的宽度的26%;
height:200px;
bottom:30px;//box的底部高于其父元素中position为static之外的第一个元素的底部30px;

position:absolute;//如果position为fixed,则box的位置,宽度引用均参照于浏览器窗口的大小;
}

2.fixed:生成绝对定位的元素,相对于浏览器窗口

3.static:position的默认值,此时忽略当前元素上定义的top,left,reght,bottom,z-index

4.relative 生成相对定位元素,按照正常的位置进行布局,top=20px 会给该元素左侧增加20px的间隔。

.main {
position:relative;
margin-top:50px;
border-style:dashed;
border-color:red;
border-width:3px;
height:300px;
width:1560px;
}

5.inherit从父元素获取position值

 

以上是关于CCS基础 - position的主要内容,如果未能解决你的问题,请参考以下文章

CCS基础 - position

(HTML + CCS3 为分页媒体生成的内容)到 PDF? [关闭]

Python-ccs高级选择器 盒模型

ccs中c编译器生成的段都有哪些

ccs8.3.1导入ccs3.3工程 28335

CCS 5.5的安装教程