1 伪类和伪元素
有时候，你需要选择本身没有标签，但是 仍然易于识别的网页部位，比如段落首行 或鼠标滑过的连接。CSS为他们提供一些选 择器：伪类和伪元素。
有四个伪类可以让你根据访问者与该链接的交 互方式，将链接设置成4种不同的状态。
正常链接
a:link
访问过的链接
a:visited（只能定义字体颜色）
鼠标滑过的链接
a:hover
正在点击的链接
a:active
获取焦点
:focus
指定元素前
:before
指定元素后
:after
选中的元素
::selection
首字母
:first-letter
首行
:first-line
属性选择器可以挑选带有特殊属性的标签。
语法:
[属性名]
[属性名=“属性值”]
[属性名~=“属性值”]
[属性名|=“属性值”]
[属性名^=“属性值”]
[属性名$=“属性值”]
[属性名*=“属性值”]
子元素选择器可以给另一个元素的子元素 设置样式。
语法：
父元素 > 子元素{}
比如body > h1将选择body子标签中的所 有h1标签。
##7 其他子元素选择器
:first-child
选择第一个子标签
:last-child
选择最后一个子标签
:nth-child
选择指定位置的子元素
:first-of-type
:last-of-type
:nth-of-type
选择指定类型的子元素
除了根据祖先父子关系，还可以根据兄弟 关系查找元素。
语法:
查找后边一个兄弟元素
兄弟元素 + 兄弟元素{}
查找后边所有的兄弟元素
兄弟元素 ~ 兄弟元素{}
否定伪类可以帮助我们选择不是其他东西 的某件东西。
语法:
:not(选择器){}
比如p:not(.hello)表示选择所有的p元素但 是class为hello的除外。
就像父亲的财产会遗传给儿子一样，在CSS中祖先元素的样式 同样也会被子元素继承。
继承是指应用在一个标签上的那些CSS样式会同时被应用到其 内嵌标签上。
比如为父元素设置了字体颜色，子元素也会应用上相同的颜色。
当然并不是所有的样式都会被继承，这一点我们讲到具体样式 时，再去讨论。
内联样式：权重是 1000
id选择器：权重是 100
类、属性、伪类选择器：权重是 10
元素选择器：权重是 1
通配符：权重是 0
<em>和<strong>
em标签用于表示一段内容中的着重点。
strong标签用于表示一个内容的重要性。
这两个标签可以单独使用，也可以一起使用
通常em显示为斜体，而strong显示为粗体
<i><b>
i标签会使文字变成斜体。
b标签会使文字变成粗体
这两个标签和em和strong类似，但是这两 个标签没有语义。
所以根据html5标准，当我们只想设置文本 特殊显示，而不需要强调内容时
就可以使 用i和b标签。
<small>
small标签表示细则一类的旁注，通常包括 免责声明、注意事项、法律限制、
版权信 息等。
浏览器在显示small标签时会显示一个比父 元素小的字号。
<cite>
使用cite标签可以指明对某内容的引用或参 考。例如，戏剧、文章或图书的标题，
歌 曲、电影、照片或雕塑的名称等。
<p>
<cite>《七龙珠》</cite>讲的是召唤神龙的故事。
</p>
<blockquote>和<q>
blockquote和q表示标记引用的文本。
blockquote用于长引用，q用于短引用。
在两个标签中还可以使用cite属性来表示引 用的地址。
孟子曾经说过：
<blockquote>天将降大任于是人也...</blockquote>
他说的真对啊！
<p>孔子曾经说过：<q>学而时习之不亦说乎</q></p>
<sup>和<sub>
sup和sub用于定义上标和下标。
上标主要用于表示类似于103中的3。
下标则用于表示类似余H2O中的2。
<ins>和<del>
ins表示插入的内容，显示时通常会加上下 划线。
del表示删除的内容，显示时通常会加上删 除线。
<code>和<pre>
如果你的内容包含代码示例或文件名，就 可以使用code元素。
pre元素表示的是预格式化文本，可以使用
pre包住code来表示一段代码。
<pre>
<code>
function fun(){ alert("hello");
}
</code>
</pre>
网友评论