15-07-27 HTML-样式-格式与布局

格式与布局

流式布局：

float:left/right 向左流/向右流    

clera:both 截断流

例如木头放在水流上碰到墙，挨个停下，先流的先靠墙停下

元素并列

元素嵌套

定位布局：

position:fixed/absolute/relative;top right bottom left

三种定位方式的区别

①position：fixed --锁定位置（相对于当前浏览器边界），例如有些网站右下角的弹窗

②position：relative --相对位置（以元素本来应该在的位置为坐标）

③position：absolute --相对位置

外围的元素中没有position(absolute relative)样式--以浏览器边框为左边

如果外围中有position(absolute relative)样式--以外围离它最近的那个元素坐标布局

<只有设定好position后，top right bottom left (上右下左)才能用>

④z-index --分层（值越大越靠上）在Z轴方向分层，可以理解为分成一摞纸，层数越高越往上

附：

overflow:hidden; --超出范围时隐藏；scroll，超出范围时出滚动条

a:hover -- 设置鼠标指向链接时的形式（a为a标签）

{ cursor:pointrt(鼠标指到上面时的形状，pointer为小手形状) }

opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=50)  --透明效果为50%，三种方法可任选其一

display:none; 隐藏；block显示 （隐藏会直接去除这个元素）

visibility:hidden; 隐藏；visible显示（元素位置还在，内容隐藏）

border-radius:15px;  --圆角边框，圆角大小为15像素

&copy  --版权符号