我們直接看例子然后在來解釋用法。
<!DOCTYPE html>
<html>
<head>
<style>
input[type="checkbox"]+p:before{
content:"臺詞：";
}
</style>
</head>
<body>
<input type="checkbox"/><p>我是唐老鴨。</p>
<p>我住在 Duckburg。</p>
<p><b>注釋：</b>對在 IE8 中工作的 :before，必須聲明 DOCTYPE。</p>
</body>
</html>
頁面效果顯示以下：
我們來解釋1下下面這個css寫法的用處
input[type="checkbox"]+p:before{
content:"臺詞：";
}
它只會在checkbox 緊接著的第1個標簽為p的段落加上“臺詞” 這兩個字
這里有個 + 和：before的用法，+ 這里理解為and的意思，即input[type="checkbox"] 且 第1個p 才會加上樣式
第2個例子
看樣式寫法。
.dataTables_wrapper .row:first-child {
padding: 12px 0px 4px;
margin: 0px 0px;
background-color: #eff3f8;
}
這個樣式只會對第1個th 起作用，第2個th是不起作用的，同時 最后1個可以這樣寫.dataTables_wrapper .row:last-child
第3個例子。
用css樣式畫1個圓
div
{
background-color: #000;
color: #fff;
border: 2px solid #fff;
border-radius: 32px;
height: 24px;
width: 24px;
}
程序員人生，我編程，我富裕，記住wfuyu網，php教程，php學習，php手冊，CMS模版制作
聲明：本站大部分內容是作者原創，少部分收集于互聯網供大家一起學習，原版權很多不明，如有侵權請聯系本站，謝謝！
粵ICP備14040726號-1?? 2015-2020 程序員人生 版權所有
