标签:inpu 标签 size site 选择器 hover :link 伪元素 :active
伪类选择器
1 <style> 2 a:link{ # 未访问连接 3 color: green; 4 } 5 a:visited{ # 已访问连接 6 color: yellow; 7 } 8 a:hover{ #鼠标悬浮颜色 9 color: aqua; 10 } 11 a:active{ # 鼠标按下去的颜色 12 color: brown; 13 } 14 div:hover{ # hover可以应用于其他的标签 15 color: brown; 16 } 17 </style>
focus 标签
1 input:focus{ 2 background-color: pink; 3 } input标签获得光标显示的颜色
伪元素选择器
1 div:first-letter{ 第一个字母变化 2 font-size: 48px; 3 color: red; 4 } 5 div:before{ 在元素前面加上内容 6 content: ‘你好‘; 7 color: pink; 8 font-size: 48px; 9 } 10 div:after{ 11 content: ‘ahahah‘; 12 color: brown; 13 font-size: 20px; 14 }
选择器的优先级
1 <style> 2 body{ 优先级1 3 color: pink; 4 } 5 .c1{ 优先级10 6 color: red; 7 } 8 #aa{ 优先级100 9 color: saddlebrown; 10 } 11 </style>
1 <p style="color: red">你好啊</p> 优先级10000 内嵌样式
1 color: blue!important; 优先级最大
标签:inpu 标签 size site 选择器 hover :link 伪元素 :active
原文地址:https://www.cnblogs.com/ch2020/p/12952333.html