伪类选择器
4个伪类选择器:l-v-h-a
-
:link
a:link{color:red} /*未被访问的链接*/
-
:visited
a:visited{color:blue}} /*已被访问的链接*/
-
:hover
a:hiver{cursor:pointer} /*鼠标移动到链接上*/
-
active
a:active{color:pink} /*正被点击的链接*/
伪元素选择器
4个伪元素选择器:first-line、first-letter、before、after
-
:first-line 选中第一行
-
:first-letter 选中第一个字母
-
:before 在某个元素前插入内容
-
:after 在某个元素后插入内容
<style> div{ width: 50px; height: 50px; background: #9cdfed; border-radius: 50%; } div:after{ content: ""; width: 30px; height: 30px; background: #e6c1e0; display: block; position: relative; left: 10px; top: 10px; } <