區塊元素

區塊元素（或稱區塊層級元素），可以設置 width(寬度)、height(高度)，在一般默認下的區塊元素，寬度會跟隨父層寬度，故而不允許其他元素佔據其相同水平空間，對應的 display 為 block；區塊元素的矩形結構稱之為盒模型( box model )，由 content、padding、border、margin所組成

區塊元素包含

• 文字
  • p - 段落
  • h1, h2, h3, h4, h5, h6 - 標題
• 列表
  • dl - 定義列表-清單
  • dt - 定義列表-項目
  • dd - 定義列表-描述
  • ol - 有排序之編號清單
  • ul - 未排序之項目符號清單
  • li - 清單中之列表項目
• 其他區塊元素
  • address - 地址
  • blockquote - 塊引用
  • div - 區塊
  • menu - 菜單列表
  • main - 主體內容
  • npscript - script 的替代內容（對于不支持 script 的瀏覽器顯示此內容）
  • pre - 預先格式化文字
  • figure - 有標題的獨立內容，常使用於插圖、圖表或程式片段等，標題是放在其內的 figcaption 元素裡。
  • header - 文章標題內容
  • nav - 導覽
  • aside - 側邊欄
  • article - 文章內容
  • section - 段落
  • footer - 頁尾
  • form - 表單
  • fieldset - 表單群組
  • canvas - 定義圖形
  • hgroup - 群組文章標題
  • table - 表格
  • tfoot - 表格腳尾
  • video -嵌入媒體播放器
  • audio -嵌入音頻播放器
• 空元素(只有開始標籤而沒有結束標籤的就稱為空元素)
  • hr - 水平分隔線

行內元素(inline)

又稱內聯元素，和其他元素都在一行上，相臨的行内元素会排列在同一行；無法設置 width 、 height ，只能靠內容撐起來，上下的 padding 和 margin 設置會無效，但左右的有效，對應的 display 為 inline

上下的 padding、margin 為 padding-top ,padding-bottom, margin-top, margin-bottom

左右的 padding、margin為 padding-left，padding-right，
margin-left，margin-right

• 行內元素包含
  • a - 連結
• 短語元素
  • abbr - 縮寫標記
  • acronym -首字母縮寫
  • b - 文字加粗
  • bdo - 覆蓋當前文字方向
  • cite - 引用文字
  • dfn - 定義術語/專業行話
  • em - 強調文字(斜體)
  • i - 斜體
  • strong - 加重文字
  • q - 短引用
  • label - input 文字標籤
  • samp - 標示電腦程序輸出
  • small - 字體變小
  • span - 常用行內元素，定義文字內區塊
  • sub - 下標
  • sup - 上標
• 電腦術語元素
  • code - 程式碼的片段
  • kbd - 定義鍵盤文字
  • var - 定義變量
• 其他元素
  • output - 表單輸出
  • select - 項目選單
  • textarea - 多行文本輸入框
• 空元素
  • br - 換行
  • img - 圖片
  • input - 輸入框