標籤：
1. Overflow:
是否隱藏超出容器範圍之外的內容，主要參數包括Hidden(隱藏),Auto（根據容器內容自動顯示捲軸）,scroll（顯示捲軸，即使內容不超出容器範圍，也會顯示一個邊框，效果非常不好）；
2. Relative & Absulote
Relative:將元素從文檔流中部分不完全脫離出來，因為它先前的位置無法被其他元素所佔據；
Absolute:一個元素的Position被設定為Absolute後，而該元素的父級元素沒有設定Position屬性，則會一直往上找，如何可以找到，則以該父元素做參考進行定位，否則會將<body>做為參考，即：該元素會以螢幕左上方為原點進行定位；
將元素從文檔流中完全脫離出來，先前位置會被後續元素所佔據；
3. 幾種選取器
A. 元素選取器(類型選取器)
html{color:red;}
p{color:gray;}
h2{color:silver;}
B. 萬用字元選取器(*)
C. 類別選取器
用法1：
<p class=‘important‘>This paragraph is very important</p>
.important{color:red;}
用法2(結合元素選取器)：
p.important{color:red;}/*帶有important樣式的元素p*/
D. ID選取器
E. 屬性選取器
img[alt] {border: 5px solid red;}
F. 子選取器
G. 後代選取器
H. 兄弟選取器
<li>L1</li><li>L2</li><li>L3</li>
li+li{font-weight:bold;} /*L2/L3 會變粗*/
4. display 屬性
inline:將區塊層級元素內容顯示為行級元素;
inline-block:將行級元素內容顯示為區塊層級元素；
Example:
<html><head> <title>Inline Testing</title></head><body> <div title="The width and height is no effect on inline element!" style="background-color:blue;width:200px;height:200px;display:inline;">Div is block element!</div> <div title="Elements with inline property will be in one line with the line-level elements!"> <div style="background-color:red;display:inline">RED CUBE</div><a href="www.google.com.sg">Google.SG</a> </div> <div> <a title="Adding width and height to the line-level element!" href="www.google.com.sg" style="background-color:purple;display:inline-block;width:200px;height:200px;">Google.SG</a> </div></body></html>View Code
CSS樣式匯總
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
