1.下表列出了內聯元素和塊級元素的主要區別
塊級元素 | 行內元素 |
獨占一行,默認情況下,其寬度自動填滿其父元素寬度 | 相鄰的行內元素會排列在同一行里,直到一行排不下,才會換行,其寬度隨元素的內容而變化 |
可以設置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> 定義短的引用
<s> 表示不准確不相關,卻不應當給予刪除的內容
<samp> 定義樣本文本
<select> 定義單選或者多選菜單
<small> 呈現小號字體效果
<span> 組合文檔中的行內元素
<strong> 語氣更強的強調內容
<sub> 定義下標文本
<sup> 定義上標文本
<textarea> 多行文本輸入控件
<tt> 打字機或者等寬的文本效果
<var> 定義變量
<input>和<img>都是行內元素,但是它們是可以設置寬和高的。這里就涉及到可替換元素和不可替換元素。
替換元素就是瀏覽器根據元素的標簽和屬性,來決定元素的具體顯示內容。
例如瀏覽器會根據<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>是一個不可替換元素,文字“段落的內容”全被顯示。