1.CSS简介
CSS(Cascading Style Sheets,串联样式表) 是一种用来表现HTML或XML等文件样式的计算机语言。
特点:
- 丰富的样式定义
- 易于使用和修改
- 多页面应用
- 层叠
- 页面压缩
CSS发展史
1994年,哈坤 - 利提出CSS的最初建议。而当时伯特-波斯正在设计一个名为Argo的浏览器,
于是他们决定一起设计CSS。
2.CSS3语法结构
语法:
选择器{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
属性:
font-size和color,分别表示字体大小和字体颜色。
3.CSS样式
行内样式语法:(直接写在标签上)
<标签名 style=“属性1:属性值1;属性2:属性值2;属性3:属性值3;”>内容</标签名>
内部样式语法:(单独写在页面的< style>标签中)
< head>
< meta charset=“UTF-8”>
< title>style标签语法< /title>
< style>
选择器{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
< /style>
< /head>
外部样式表:(另外写在.css后缀的文件里)
< head>
< meta charset=“UTF-8”>
< title>链接外部样式表< /title>
<link rel=“stylesheet” href=style.css"text/css">
< /head>
4.样式优先级
如果只有外部式表,则显然只会外部样式表设置的颜色值,因此可得出结论:行内样式>内部样式表>外部样式表
5.CSS3选择器
标签选择器语法:
标签名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
类选择器:
.类名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
ID选择器:
#id名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
6.CSS3高级选择器
1.层次选择器
- 后代选择器
- 子选择器
- 相邻同胞选择器
- 通用兄弟选择器
2.结构伪类选择器
- :first-child选择器
- :last-child选择器
- :nth-child(n)选择器
- :first-of-type选择器
- :last-of-type选择器
- :nth-of-type(n)选择器
3.属性选择器
- E[attr]
- E[attr=val]
- E[attr^=val]
- E[attr$=val]
- E[attr*=val]