亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

四種css 偽類選擇器

  發(fā)布時間:2012-04-18 13:44:28   作者:佚名   我要評論
偽類,用于給元素的片段添加樣式,這如何理解呢?比如你要讓一個段落的第一行的文字加粗,那么這個選擇器是不二之選

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 Code
p::first-letter {
float: left;
font-size: 2em;
font-weight: bold;
font-family: cursive;
padding-right: 2px;
}

相關文章

最新評論