1.css样式表的语法
属性名:属性值;属性名:属性值;.....
2.引入css的三种方式
行内css:写在标签的style属性的值里面
内部css:写在style标签里面
外部css:写在外部css文件中,通过link标签引入
<link rel="stylesheet" href="url" />
3.选择器的语法
选择器{样式表}
4.基本选择器
标签选择器:标签名{样式表}
类选择器:.类名{样式表}
类名是标签的class属性的值
id选择器:#id{样式表}
id是标签的id属性的值,一个页面内唯一
5.其它选择器
包含选择器:选择器1 选择器2{样式表}
匹配的选择器1中的所有选择器2
子选择器:选择器1>选择器2{样式表}
匹配的选择器1下一层的选择器2
选择器分组:选择器1,选择器2,...,选择器n{样式表}
n个选择器共用一个样式表
6.伪类
a标签的四种状态
a:link 未访问的链接
a:visited 已访问的链接
a:hover 鼠标移在链接上面的状态
a:active 鼠标按下链接的状态
注意:hover写在link与visited后面
active写在hover后面
:after与:before
在标签的内容之前或者之后追加内容
配合content属性使用
例: a:after{content:"->"}
7.font字体属性
font-size:字体大小
font-weight:字体粗细 bold
font-style:字体斜体 italic
font-family:使用的字体
line-height:行高
font:复合属性,能定义上面的五个
font:[font-style] [font-weight] font-size/line-height font-family;
color属性:定义字体颜色
值得三种写法:
1.英文单词
2.rgb的16进制写法 #ffffff
3.rgb的10进制写法
rgb(255,255,255)
rgba(255,255,255,1)
text-decoration:none(没效果) | underline(下划线)
8.文本属性
text-indent:首行缩进 建议使用2em
text-align:水平对齐方式 left|right|center
