1. 程式人生 > >html標籤分類及常用標籤

html標籤分類及常用標籤

html標籤

html標籤 HTML 元素指的是從開始標籤(start tag)到結束標籤(end tag)的所有程式碼。

  • 標籤不會出現在頁面中,只有標籤中的內容才會顯示在頁面上  :也就是 < html > 此處為內容 </
    html
    >
  • 標籤不區分大小寫,但是推薦使用小寫  :(X)HTML 版本中強制使用小寫,這樣更加嚴謹
  • 標籤分為閉合標籤和空標籤  :閉合標籤是指由開始標籤和結束標籤組成的一對標籤,這種標籤允許巢狀和承載內容,例如: < html >
    </ html > < p > </ p >
    ;空標籤是沒有內容的標籤,在開始標籤中自動閉合,例如: <
    img
      />
    < br   /> < hr   />

html標籤分類

html標籤又叫做html元素,它分為塊級元素和內聯元素(也可以叫做行內元素),都是html規範中的概念。

塊級元素

塊級元素是指本身屬性為display:block;的元素。因為它自身的特點,我們通常使用塊級元素來進行大布局(大結構)的搭建。

塊級元素的特點:

  • 獨佔一行,每一個塊級元素都會從新的一行重新開始,從上到下排布
  • 可以直接控制寬度、高度以及盒子模型的相關css屬性
  • 在不設定寬度的情況下,塊級元素的寬度是它父級元素內容的寬度
  • 在不設定高度的情況下,塊級元素的高度是它本身內容的高度

常用的塊級元素

標籤 描述
div 常用塊級容器,也是css layout的主要標籤
h1 大標題
h2 副標題
h3 三級標題
h4 四級標題
h5 五級標題
h6 六級標題
hr 水平分隔線
menu 選單列表
ol 有序列表
ul 無序列表
li 列表項
dl 定義列表
dt 定義術語
dd 定義描述
table 表格
p 段落
form 互動表單

內聯元素

內聯元素是指本身屬性為display:inline;的元素。因為它自身的特點,我們通常使用塊級元素來進行文字、小圖示(小結構)的搭建。

內聯元素的特點:

  • 和其他內聯元素從左到右在一行顯示
  • 不能直接控制寬度、高度以及盒子模型的相關css屬性,但是直接設定內外邊距的左右值是可以的
  • 內聯元素的寬高是由本身內容的大小決定(文字、圖片等)
  • 內聯元素只能容納文字或者其他內聯元素(此處請注意,不要在內聯元素中巢狀塊級元素)

常用的內聯元素

標籤 描述
span 常用內聯容器,定義文字內區塊
a 錨點
b 加粗
strong 加粗強調
i 斜體
em 斜體強調
s 中劃線(不推薦使用)
strike 中劃線
del 文件中已被刪除的文字
br 強制換行
u 下劃線
textarea 多行文字輸入框
input 輸入框
select 下拉列表
label input 元素定義標註(標記)
img 引入圖片
sub 下標
sup 上標
big 大字型文字
small 小字型文字