2.塊元素: 預設佔一行,沿垂直方向排列,可以設定寬度和高度,例如:<div>,<p>,<h2><form>...;
3.行內元素: 預設在一行內沿水平方向排列,寬寬和高度由內容決定,不能設定,例如<span><a><em>...;
4.替換元素: 元素內容由標籤的屬性來設定,標籤其實就是一個預留位置,例如<img src=""><input type="">
5.非替換元素: 元素內容就包含中當前的標籤中,例如<p>,<h1>,<link>
6. 如何區分替換與非替換元素呢?
6-1.替換元素因為元素內容來自外部資源,所以大多僅需要一個標籤就可以,因為單標籤比較多,但也有例外,例如:
<video><script><video>...這些標籤大多具有src,指明要引入的資源路徑.如果標籤中有內容要麼無效,
要麼僅僅是一個資源的引入。
6-2.非替換元素,它的內容由使用者直接寫在標籤中,例如<p>,<h3>等文本類標籤,是最常見的非替換元素
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>css中的基本術語</title></head><body><!--div和p標籤寫在前面就先顯示,因為是塊標籤,所以都獨佔一行垂直排列--><div>div標籤是最簡單最常用的塊標籤</div><!--開啟瀏覽器的開發人員工具(調試工具),查看元素樣式,可以看到他的display屬性: block--><p>div標籤是最簡單最常用的塊標籤</p><!--a標籤寫在了後面就在後面顯示,因為為行內標籤,所以在一行中水平排列--><a href="index.html"><em>首頁</em></a> | <a href="news.html">公司新聞</a> | <a href="about">關於我們</a><hr><!--以上的p,div標籤是非替換元素,它的內容由當前文檔提供,因為外部資源的大小具有不可控性,所以預設為行內元素--><img src="../images/1.jpg" width="100" alt=""><input type="text"></body></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
