1、分类:
内联:写在标记的属性位置,优先级最高,重用性最差
内嵌:写在页面的head中,优先级第二,重用性一般
外部:写在一个以css结尾的文件中,通过引用来建立文件与html页面的关系,优先级最低,但是最灵活最好用,重用性最好
2、选择器:
id选择器:#id,优先级最高,id不能重复,只能选中一个元素
class选择器:.class,优先级第二,class能重名,能选中一堆元素
标签选择器:标签名 div span ,优先级最低,能选中一堆元素,不建议使用
3、特殊选择器:
并列:逗号隔开
后代:空格隔开
--------------------------------------------------------------
4、样式表属性:
--大小
width宽度
height高度
--背景
background-color背景色
background-image背景图片
background-repeat背景图的平铺方式
background-position背景图片位置
background-attachment设置背景图片是否滚动
background-size背景图片大小200px 200px
--字体
font-family字体样式
font-size字体大小12px
font-style italic倾斜
font-weight bold加粗
text-decoration underline下划线
overline上划线
line-through删除线
none没有,用来去掉超链接的下划线
color字体颜色
--对齐方式
text-align水平对齐方式
vertical-align垂直对齐方式,配合下面代码一起使用
display:table-cell
line-height行高
text-indent缩进,单位像素
--边界边框
margin外边距,单位像素,上右下左
padding内边距,单位像素,上右下左,如果加了内边距该元素会相应变大
border 1px solid #60F 简写方式,第一个边框粗细,第二个边框样式,第三个边框颜色
--列表方块(配合有序、无序使用)
list-style none将列表前面的序号去表
list-style-image可以将前面的序号变为图片
--格式布局
位置
position fixed 固定,相对于浏览器边框位置固定
absolute绝对位置,相对于父级元素(浏览器,绝对定位的上级)
relative相对位置,相对于自身应该出现的位置
top距离上边的距离
right距离右边的距离
bottom距离下边的位置
left距离左边的位置
流
float left向左流
float right向右流
clear both清流
z-index分层,值越大越靠上
其他
display显示block隐藏none,不占位置
visibility显示visible隐藏hidden,占位置
overflow超出范围hidden隐藏
透明opacity:0.5;-moz-opacity:0.5;filter:alpha(opacity=50) 一般三个都写,第一个针对谷歌,第二个针对火狐,第三个针对IE
圆角border-radius:5px;
阴影box-shadow:0 0 5px white;