2019/07/26 10:32:49
CSS:
1.语法由选择器和一条到多条声明组成规则集。
2.元素选择器下的声明会应用到当前文档中所有该元素。
例：p{
color:green;
}
注：所有段落字体颜色为green.
3. 类选择器会应用到所有拥有该类的元素。
例：.stress{
font-size:21px;
}
<span class="stress">
<p class="stress">
注：包含.stress属性值的都会改变字体大小。
4. ID选择器ID名具有唯一性。
例：<span id="stress">
注：只能有一个id名为.stress.
5. 编写规则：不要将多条声明写在一行。
例：p{color:red;fout-size:21px;backgronud:blue}
6. 语义化结构标记（HTML5新增）:
标签名 |
含义 |
<header> |
用于表示页面或某个区域的头部。 |
<nav> |
用于表示导航栏。 |
<aside> |
用于表示跟周围主题相关的附加信息。 |
<article> |
用于表示文章或其他可独立页面存在的内容。 |
<section> |
用于表示一个整体的一部分主题。 |
<footer> |
用于表示页面或某个区域的脚注。 |
7. 文本元素：
| 标签名 |
含义 |
<h1>~<h6> |
1级标题~6级标题 |
<P> |
段落 |
<strong> |
重要的文本（表示强调）在语义上是强调文本的重要性，因此它是将文本设置为粗体的最常见选项。 |
<b> |
应突出显示的文本 |
<em> |
强调的文本(斜体) |
<i> |
应区别对待的文本 |
<span> |
跨越多个字符 |
<q> |
小段文本的引用 |
<cite> |
对参考文献的引用 |
<abbr> |
对缩写词的引用 |
| |
例：<abbr title="全称">简写</abbr> |
| |
例：<abbr title="Hypertext Markup language">html</abbr> |
<blockquote> |
整段的引用 |
<a> |
链接 |
| |
<a href="打开的路径" target="从新的标签页打开"> |
| |
例：<a href="http://runoob.com" target="_blank">菜鸟</a> |
8. 路径：
- 相对路径 link如果在同一路径下，直接填写文件名即可。
- 绝对路径 href必须填写完整的路径的文件名。 ../表示返回上一级目录 ./表示当前资源所在的目录（可以省略）
9. 编码特殊字符：
| 书写形式 |
含义 |
|
空格 |
© |
版权 (一个圈圈一个C) |
< |
大于 |
> |
小于 |
® |
注册 (一个圈圈一个R ®) |
& |
&符号 |
乱数假文 |
Lorem ipsum |
10. 颜色单位：
h1{
color:white;
color:#fff;
color:rgb(255,255,255);
}
长度单位
一个尺寸是由长度+单位组成的
绝对长度：px
相对长度：em
11. *{}通配：匹配到当前文档的所有元素
12. 属性选择器
[属性=值]
[class=testclass]{}
13. 伪类选择器
a:link(“未访问”){
color:#000;
}
a:visited(“访问后”){
color:#ccc;
}
a:hover(“移入”){
color:red;
}
a:acrive(“点击时”){
font-size:30px;
}
14. 伪元素：可以给标签加字.(css3区分伪类和伪元素，将伪元素改为：：)
：first-letter 第一个字
：first-line 第一行
a::before{content:"之前"}
a::after{content:"之后"}
15. 组合选择器（并集选择器）
h1,h2,h3,h4{
font-weight:normal;
}
特点：形式不限，元素，类，id都可以选择
16. 子选择器
ul>li （大于）表示子集选择器
特点：用于选择指定标签元素的第一代子元素。
17. 后代选择器
ul li （空格）表示后代选择器
特点：用于选择指定标签元素下的所有后代元素。