浮动和定位
2017-10-14 本文已影响0人
梨啊梨
限制宽度和高度
min-width、min-height、max-width、max-height
可以为元素的内容区定义一个最大尺寸 最小尺寸
内容溢出和剪裁
如果一个元素的内容对于元素大小来说过大,就有可能溢出元素本身
溢出
一个元素固定为某个特定大小,但内容在元素中放不下,此时可以控制overflow属性控制这种情况
overflow
值:visible hidden scroll auto inherit
初始值:visible
应用于:块级元素和替换元素
无继承性
visible:元素的内容在元素框之外也可见
scroll:元素的内容会在元素框的边界处剪裁,他会提供滚动条
hidden:元素的内容会在元素框的边界处剪裁,超出区域的内容不会显示
auto:用户代理来决定
内容剪裁
如果一个绝对定位元素的内容溢出其内容框,而且overflow设置为要求剪裁该内容,可以使用clip改变剪裁区域的形状
clip:rect(top,right,bottom,left)
应用于绝对定位元素,CSS2中可以用于块级元素和替换元素
rect(...)的值不是边偏移,而是距元素左上角的距离
只允许长度值和auto,不可以有百分数
元素可见性visibility
值:visible、hidden、collapse、inherit
应用于所有元素
visible:可见的
hidden:不可见,但是他会影响文档的布局,元素还在那里(留着他的空间),只不过你看不见他,与display:none有区别,display:none不仅不显示,而且会从文档中删除,对文档布局没有任何影响
z-index
利用z-index可以改变元素相互覆盖的顺序。
较高的z-index值会覆盖在低的上方
单位:所有整数,包括负数
绝对定位
相对定位
固定定位
pisition:fixed,也能让元素脱离标准文档流
应用场景:固定到浏览器窗口固定位置的元素,跟随导航、回到顶部