CSS中有一个小技巧,就是可以用两个点“::”来代替一个冒号“:”,用来区分伪类和伪元素。 示例1: p:hover { color: red; } p::before { content: 前置文本
CSS中有一个小技巧,就是可以用两个点“::”来代替一个冒号“:”,用来区分伪类和伪元素。
示例1: p:hover { color: red; } p::before { content: "前置文本"; } p::after { content: "后置文本"; }
上面的代码中,使用了单个冒号的伪类:hover,以及使用了双点的伪元素::before和::after,用来在p标签前后添加文本内容。
双点也可以用来区分伪元素和伪类中的参数。例如在::first-letter中,如果使用单冒号,那么在IE6、IE7、IE8等低版本浏览器中,就会不起作用。而使用双点,则可以保证在各种浏览器中都能生效。
示例2: p:first-letter { font-size: 20px; } p::first-letter { font-size: 20px; }
上面的代码中,第一行使用了单冒号,只有在高版本的浏览器中才会生效;而第二行使用了双点,则可以保证在各种浏览器中都能正常显示字母的字号。
粉丝
0
关注
0
收藏
0