web相容學習分析筆記--塊級、內聯、內聯區塊層級元素

標籤：學習   line   ott   padding   標籤   電影   其他   iframe   div   

一、塊級、內聯、內聯區塊層級元素

（1）區塊層級元素：block    

       **獨佔一行

       **可設定width，height，margin，padding

       **內部可包含塊級或內嵌元素

 

（3）內聯（行內）元素：inline      

       **和其他inline元素同行顯示

       **可以設定margin-left，margin-righ，padding-left，padding-right，

       **無效設定widht，height，margin-top，margin-bottom，padding-top，padding-bottom

       **內部可包含塊級或內嵌元素，內部包含區塊層級元素時，該區塊層級元素繼續保持獨行顯示，下一個內嵌元素會換行顯示

 

（4）內聯區塊層級元素：inline-block

       **和其他inline或inline-block元素同行顯示。

       **和區塊層級元素一樣可設定width，height，margin，padding。

       **內部可包含塊級或內嵌元素，內部包含區塊層級元素時，該區塊層級元素會在內嵌元素的內部獨行顯示，不會影響下一個內嵌元素的同行顯示

 

區塊層級元素

<div> 定義文檔中的節

<blockquote>定義長的引用

<dl>定義列表詳情

<fieldset> 定義圍繞表單元素的邊框

</form> 定義html的表單

<h1>--<h6> 標題

<hr> 水平線

<legend> 定義<fieldset>元素的標題

<li> 定義列表的項目

<object> 定義內嵌對象

<ol> 定義有序列表

<p> 定義段落

<pre> 定義預格式文本

<table> 定義表格

<ul>定義無序列表

 

Html5新元素

<article> 定義一個文章地區

<aside> 定義頁面的側邊欄內容

<audio> 定義音頻內容

<canvas> 定義畫布

<dialog> 定義對話方塊，比如提示框

<embed> 定義嵌入的內容，比如外掛程式

<figure> 定義獨立的流內容（映像、表徵圖、照片、代碼等）

<figcaption> 定義元素的標題

<footer> 定義section或document的頁尾 

<header> 定義文檔的頭部地區

<nav> 定義導航連結的部分

<section> 標籤定義文檔中的節（section、區段）。比如章節、頁首、頁尾或文檔中的其他部分

<summary> 標籤包含 details 元素的標題，"details" 元素用於描述有關文檔或文檔片段的詳細資料

 

內嵌元素

<a> 超文本連結

<address> 文檔作者或擁有者的聯絡資訊

<abbr> ,<acronym>  定義縮寫

<area> 定義影像地圖內部的地區

<b>加粗字型

<bdo> 定義文字方向

<cite>定義引用

<code> 電腦代碼

<dfn> 定義定義項目

<em> 定義強調文本

<i> 斜體

<ins> 定義被插入的文本

<kbd> 定義鍵盤文本

<label>定義input元素的標註

<map> 定義圖形映射

<mark> 定義帶記號的文本

<q> 定義短的引用

<samp> 電腦樣本

<samll> 定義小號文本

<span> 定義文檔中的節

<strong> 定義強調文本

<sub> 定義下標文本

<sup> 定義上標文本

<tt> 定義打字機文本

<var> 定義文本的變數部分

 

Html5新元素

<bdi> 允許您設定一段文本，使其脫離其父元素的文本方向設定。

<meter> 定義度量衡。僅用於已知最大和最小值的度量

<rp>  在 ruby 注釋中使用，以定義不支援 ruby 元素的瀏覽器所顯示的內容

<rt>  標籤定義字元（中文注音或字元）的解釋或發音

<ruby> 標籤定義 ruby 注釋（中文注音或字元）

<time> 定義日期或時間，或者兩者

<wbr> 規定在文本中的何處適合添加分行符號

 

內聯區塊層級元素

 <button> 定義一個點擊按鈕

<iframe> 定義內聯架構

<img>  定義映像

 <input>  定義輸入控制項

<select> 定義挑選清單（下拉式清單）

<textarea>  定義多行的文本輸入控制項

 

Html5新元素

<video> 標籤定義視頻，比如電影片段或其他視頻流

<keygen> 對錶單產生密鑰欄位

<progress> 定義運行中的進度（進程）

 

 

 

leona

原文連結：http://www.cnblogs.com/leona-d/p/5950280.html 

著作權聲明：本文著作權歸作者和部落格園共有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文連結

web相容學習分析筆記--塊級、內聯、內聯區塊層級元素