<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>僞類元素選擇器</title>
<style type="text/css">
div:after{
content: "後面添加";
}
div:before{
content: "前面的";
}
</style>
</head>
<body>
:before 在内容前面添加一個元素
:after 在内容後面添加一個元素
添加内容用content屬性
<div>123</div>
content:屬性值
1.content:“字元串”;
2.圖檔 content:url(圖檔路徑);注意:圖檔是原尺寸插入 不可改變大小
3.空 content:"";
4.計數器:content:counter(li);計數清單時非常友善。
注意:僞元素時不可以通過content屬性來插入html代碼的. 錯誤代碼:content:"<h1>标題<h2>"
:before :after作用:在内容前面或後面添加額外的内容。
在css3中僞元素用雙冒号(::)來表示,主要是為了區分僞類(:);
6.用僞元素清除浮動。
注意:一定是在父級上寫
文法:
選擇器:after{
content:"";
dispaly:block;<!-- 要注意轉化成塊級标簽-->
clear:both;
}
</body>
</html>