/*--------------------
本文为个人学习笔记，
基于书本以及自身掌握，
对相关内容未做深入展开
--------------------*/
伪类&伪元素
- 首字样式控制 —— 使用伪元素
::first-letter
<p>首字放大的效果</p>
p::first-letter{
font-size: 40px;
}
首字放大
<p>uppercase</p>
p::first-letter{
text-transform:uppercase
}
首字母大写
- 首行样式控制 —— 使用伪元素
::first-line
<p>我想第一行文字有加粗效果，不管屏幕宽度多少，始终能做到这个效果。</p>
p{
width:200px;
}
p::first-line{
font-weight: bold;
}
首行控制
- 伪元素
::before与::after用于为DOM中的元素添加内容；需要配合特有的content属性；注意，添加的内容并不真正存在于DOM中；另外，基于表现与内容分离的原则，我们使用这两个伪元素的目的是进行样式控制，而不是真正的内容输出，后者是HTML的事。 - 伪类是对CSS选择器的补充、扩展以及筛选；锚伪类即超链接伪类是最常见的，比如
:hover、:link、:active、:visited等，此时的伪类用于对同一元素的不同状态进行控制，表单元素获得焦点时通过:focus伪类进行控制也相似；CSS3的:nth-child()等伪类则更多扩展了CSS选择器的“选择”功能。
样式优先权
- 行内（
style="..."） > 内部（<style>...</style>） > 外部（<link href="..."/>） - id选择器（
#idName{}） > 类选择器（.className{}） > 元素标签选择器（p{}） - 两行相同属性的定义，后者会覆盖前者
-
!important优先于以上所有
