后代选择器
- 后代选择器可以根据标签的关系,为处在元素内部的代元素设置样式
语法:祖先元素 后代元素 后代元素{ }
给链接定义样式
- a:link 正常链接
- a:visited 访问过得链接
- a:hover 鼠标滑过的链接
- a:active 正在点击的链接
其他
- :focus 获取焦点
- :before 指定元素前
- :after 指定元素后
- ::selection 选中的元素
其他选择器
给段落定义样式
- :first-letter 首字母
- :first-line 首行
属性选择器
[属性名]
[属性名="属性值"]
[属性名~="属性值"]
[属性名|="属性值"]
[属性名^="属性值"]
[属性名$="属性值"]
[属性名*="属性值"]
子元素选择器
- 子元素选择器可以给另一个元素的子元素设置样式
语法: 父元素>子元素{ }
其他子元素选择器
- :first-child 选择第一个子标签
- :last-child 选择最后一个子标签
- :nth-child 选择指定位置的子元素
- :first-of-type 选择指定类型的子元素
- :last-of-type 选择指定类型的子元素
- :nth-of-type 选择指定类型的子元素
兄弟选择器
- 除了根据祖先父子关系,还可以根据兄弟关系查找元素
语法:
兄弟元素+兄弟元素{ } 查找后边一个兄弟元素
兄弟元素~兄弟元素{ } 查找后边所有的兄弟元素
否定伪类
- 否定伪类可以帮助我们选择不是其他东西的某件东西
语法::not(选择器){ }
继承
- 继承是指应用在一个标签上的那些CSS样式会同时被应用到其他内嵌标签上,比如为父元素设置了字体颜色,子元素也会应用上相同的颜色
选择器的权重
- 不同的选择器有不同的权重值
内联样式:权重是1000
ID选择器:权重是100
类、属性、伪类选择器:权重是10
元素选择器:权重是1
通配符:权重是0
文本标签
<em>和<strong>
- em标签表示一段内容中的着重点
- strong标签用于表示一个内容的重要性
(这两个标签可以单独使用,也可以一起使用,通常em显示为斜体,而strong显示为粗体)
<i>和<b>
- i标签会使文字变成斜体
- b标签会使文字变成粗体
(这两个标签和em,strong类似,但是这两个标签没有语义)
<small>
- <small>标签表示细则一类的旁注,通常包括免责声明、注意事项、法律限制、版权信息等。
(浏览器在显示<small>标签时会显示一个比父元素小的字号)
<cite>
- 使用<cite>标签可以指明对某内容的引用或参考。例如:戏剧、文章和图书的标题、歌曲、电影、照片或雕塑的名称等。
<blockquote>和<q>
- <blockquote>和q表示标记引用的文本
- <blockquote>用于常长引用,q用于短引用
(在两个标签中还可以使用cite属性来表示引用的地址)
sup和sub
- sup和sub用于定义上标和下标
<ins>和<del>
- ins表示插入的内容,显示时通常会加上下划线
- del表示删除的内容,显示时通常会加上删除线
<code>和<pre>
- 如果你的内容包含代码示例或文件名,就可以使用code元素
- pre元素表示的是预格式化文本,可以使用pre包住code来表示一段代码