想學好css，首先就是要學習手冊
推薦學習CSS 線上手冊。
學習完手冊，接下來就可以學習執行個體教程
推薦學習CSS 0基礎入門教程比較適合新手學習。
下面來看下學習步驟：
1.CSS規則。
偽類的文法：
selector:pseudo-class {property:value;}
CSS類也可以使用偽類：
selector.class:pseudo-class {property:value;}
http://www.php.cn/css/css-pseudo-classes.html
2.CSS聲明。
<html><head> <meta charset="utf-8"> <title>php中文網(php.cn)</title> <style> p { border-top-style:dotted; border-right-style:solid; border-bottom-style:dotted; border-left-style:solid; } </style></head><body><p>兩個不同的邊界樣式。</p></body></html>
http://www.php.cn/code/3213.html
3.值的不同寫法和單位。
<html><head> <meta charset="utf-8"> <title>php中文網(php.cn)</title> <style> body {color:red;} h1 {color:#00ff00;} p.ex {color:rgb(0,0,255);} </style></head><body><h1>這是標題</h1><p>這是一個普通的段落。請注意,本文是紅色的。頁面中定義的預設文本顏色選取器。</p><p class="ex">這是一段使用class選取器定義的p。這段文字是藍色的。</p></body></html>
http://www.php.cn/code/3148.html
4.選取器的分組。
在樣式表中有很多具有相同樣式的元素，為了盡量減少代碼，你可以使用分組選取器。每個選取器用逗號分隔。
<style> h1,h2,p { color: #d4d223; } </style>
http://www.php.cn/code/3241.html
5.繼承。
html { font-family: sans-serif;} p { line-height: 1.5;} /*This rule is not needed ↷p a { line-height: 1.5;}*/
http://www.php.cn/css-tutorial-360263.html
6.派生選取器。
<html><head><meta charset="utf-8"> <title>php中文網(php.cn)</title> <style>div p{background-color:yellow;}</style></head><body><div><p>段落 1。 在 div 中。</p><p>段落 2。 在 div 中。</p></div><p>段落 3。不在 div 中。</p><p>段落 4。不在 div 中。</p></body></html>
http://www.php.cn/code/3287.html
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
