html中內聯元素和塊級元素的區別

1.下表列出了內聯元素和塊級元素的主要區別html

html中內聯元素和塊級元素的區別
塊級元素 行內元素
獨佔一行,默認狀況下,其寬度自動填滿其父元素寬度 相鄰的行內元素會排列在同一行裏,直到一行排不下,纔會換行,其寬度隨元素的內容而變化
能夠設置width,height屬性 行內元素設置width,height屬性無效
能夠設置margin和padding屬性 行內元素起邊距做用的只有margin-left、margin-right、padding-left、padding-right,其它屬性不會起邊距效果。
對應於display:block 對應於display:inline;

2.按字母順序排列塊級元素主要有瀏覽器

<address>        定義地址
<caption>        定義表格標題
<dd>        定義列表中定義條目
<div>        定義文檔中的分區或節
<dl>        定義列表
<dt>        定義列表中的項目
<fieldset>        定義一個框架集
<form>        建立表單元素
<h1><h2><h3><h4><h5><h6>        標題元素
<hr>        水平線
<legend>        給fieldset元素定義標題
<li>        定義列表項目
<noframes>        爲那些不支持框架的瀏覽器顯示文本,放置於frameset標籤內
<noscript>        爲那些不支持腳本的瀏覽器顯示文本
<ol>        有序列表
<ul>        無序列表
<p>        定義段落
<pre>        定義預格式化文本
<table>        定義表格
<tbody>        定義表格主體
<td>        表格中的標準單元格
<tr>        表格中的行
<tfoot>        表格中的頁腳
<th>        定義表頭單元格
<thead>        定義表格的表頭框架

3.內聯元素有字體

<a>        可定義錨以及超連接
<abbr>        表示一個縮寫形式
<acronym>        表示只取title中首字母的縮寫形式
<b>        字體加粗
<bdo>        可覆蓋默認的文本方向
<big>        大號字體加粗
<br>        換行
<cite>        引用進行定義
<code>        定義計算機代碼文本
<dfn>        定義一個定義項目
<em>        定義爲強調的內容
<i>        斜體文本效果
<img>        向網頁中嵌入一張圖像
<input>        輸入框
<kbd>        定義鍵盤文本
<label>        爲input進行標記/標註
<q>        定義短的引用spa

<s>    表示不許確不相關,卻不該當給予刪除的內容code

<samp>        定義樣本文本orm

<select>        定義單選或者多選菜單
<small>        呈現小號字體效果
<span>        組合文檔中的行內元素
<strong>        語氣更強的強調內容
<sub>        定義下標文本
<sup>        定義上標文本
<textarea>        多行文本輸入控件
<tt>        打字機或者等寬的文本效果
<var>        定義變量
htm

<input>和<img>都是行內元素,可是它們是能夠設置寬和高的。這裏就涉及到可替換元素和不可替換元素。圖片

替換元素就是瀏覽器根據元素的標籤和屬性,來決定元素的具體顯示內容。ip

 例如瀏覽器會根據<img>標籤的src屬性的值來讀取圖片信息並顯示出來,而若是查看html代碼,則看不到圖片的實際內容;又例如根據<input>標籤的type屬性來決定是顯示輸入框,仍是單選按鈕等。 html中的<img>、<input>、<textarea>、<select>、<object>都是替換元素。這些元素每每沒有實際的內容,便是一個空元素,例如: <img src=」cat.jpg」 /> <input type="submit" name="submit" value="提交" /> 瀏覽器會根據元素的標籤類型和屬性來顯示這些元素。可替換元素也在其顯示中生成了框。 

不可替換元素 html 的大多數元素是不可替換元素,即其內容直接表現給用戶端(例如瀏覽器)。

例如: <p>段落的內容</p> 段落<p>是一個不可替換元素,文字「段落的內容」全被顯示。

相關文章