1. 定位
移动元素位置 体现元素的层级关系
absolute 绝对定位
特点： 元素的位置通过 "left", "top", "right" "bottom" 属性进行改变
元素设置了绝对定位那么该元素默认是以浏览器（body）左上角为参照设置定位的。
元素的父元素设置了除静态定位以外的其他定位，绝对定位的子元素是以父元素左上角为参照设置定位的。
绝对定位的元素脱标不占位置
绝对定位的元素可以实现元素模式转换（行内块元素【块级元素】）
relative 相对定位
特点: 相对定位的元素只能相对元素自己原来的位置设置定位。
相对定位的元素没有脱标占位置。
子绝父相
fixed 固定定位
特点： 脱标不占位置 可以实现模式转换 固定定位的元素只能以浏览器可视区域为参照设置定位。
static 静态定位 默认值
特点: 不能移动元素位置
2. 层级 z-indx 默认为0
3. 绝对定位居中
4. vertical-align
设置元素垂直方向的对齐方式 该元素只能给行内快元素设置 table标签也可以设置
baeline 默认基线对齐
bootom 底部对齐
top 顶部对齐
middle 中部对齐
5. 元素隐藏
overflow: hidden: 超出部分隐藏
display:none ; 隐藏元素 不占位置 与display block配合使用
visibility:hidden; 隐藏元素 占位置
6. logo内容移除
font-size:0 ; text-indext:-2000px;
7. 精灵图
在图片中测量出所需图片的左上角的坐标;
在页面中 position: x , y ;
网友评论