头闻号

泰州市海洋涂料有限公司

室外涂料|室内涂料|防水涂料|其他建筑涂料|特种涂料

首页 > 新闻中心 > 科技常识:四种css 伪类选择器
科技常识:四种css 伪类选择器
发布时间:2024-12-24 08:24:18        浏览次数:6        返回列表

今天小编跟大家讲解下有关四种css 伪类选择器 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关四种css 伪类选择器 的相关资料,希望小伙伴们看了有所帮助。

X:after

Example Source Code :.clearfix:after {content: “”;display: block;clear: both;visibility: hidden;font-size: 0;height: 0;} .clearfix {*display: inline-block;_height: 1%;}

我想上面这段代码 很多朋友都非常熟悉 是清理浮动时常用的hack方法。:after伪类与content结合使用 用于往元素类追加内容。:after伪类还有个妙用:用于产生阴影 点击这里查看。X:hover

Example Source Code:div:hover {background: #e3e3e3;}

hover在52CSS.com前面的文章中已经介绍过 IE6下只支持a的hover。  即使用border-bottom: 1px solid black; 要好于text-decoration: underline;  从实际的效果来看 使用border-bottom的距离比text-decoration来的合理 但使用border-bottom存在一些风险 比如颜色问题。X:not(selector)

Example Source Code:div:not(#container) {color: blue;} 否定伪类选择器 这还是比较好理解的 上述将会把非id为container的div的字体颜色设置为蓝色。  :not伪类IE8并不支持 IE9已经支持了。X::pseudoElement Example Source Code :p::first-line {font-weight: bold;font-size: 1.2em;}

伪类 用于给元素的片段添加样式 这如何理解呢 比如你要让一个段落的第一行的文字加粗 那么这个选择器是不二之选。  除此之外 你还可以给第一个字加上特殊样式 这个应用还是非常常见的 ::Example Source Codep::first-letter {float: left;font-size: 2em;font-weight: bold;font-family: cursive;padding-right: 2px;}

来源:爱蒂网