重學css 0x0 HTML

常見元素

head區

  • meta
  • title
  • style
  • link
  • script
  • base

body區

  • div/section/article/aside/header/footer
  • p
  • span/em/strong
  • table/thead/tbody/tr/td
  • ul/ol/li/dl/dt/dd
  • a
  • form/input/select/textarea/button

HTML 重要屬性

  • a[href,target]
  • img[src,alt]
  • table td[colspan,rowspan]
  • form[target,method,enctype]
  • input[type,value]
  • button[type]
  • select>option[value]
  • label[for]

HTML的本質

  • HTML是一種文檔
  • 描述文檔的結構
  • 有區塊和大綱

HTML的版本

  • HTML4/4.01(SGML) 瀏覽器負責部分規範修正
  • XHTML(XML) 規則嚴格
  • HTML5 代碼規範,規則寬鬆

HTML5新增內容

新區塊標籤

  • section
  • article
  • nav
  • aside

表單增強

  • 日期、時間、搜索
  • 表單驗證
  • Placeholder

新增語義

  • header/footer
  • section/article
  • nav
  • aside
  • em/strong 強調
  • i icon

HTML元素分類

按默認樣式分

  • 塊級block
  • 行內 inline 
  • inline-block

按內容分

 

 

嵌套關係

  • 塊級元素可以包含行內元素

  • 塊級元素不一定能包含塊級元素

  • 行內元素一般不能包含塊級元素

爲什麼a可以包含div?

特殊情況下a按透明計算,部分情況不能包含

默認樣式和reset

  • 默認樣式的意義
  • 默認樣式帶來的問題
  • CSS Reset
<style>
    * {
        margin: 0;
        padding: 0;
    }
</style>

補充

1.doctype的意義是什麼

  • 讓瀏覽器以標準模式渲染
  • 讓瀏覽器知道元素的合法性

2.HTML XHTML HTML5的關係

  • HTML屬於SGML
  • XHTML屬於XML,是HTML進行XML嚴格化的結果
  • HTML5不屬於SGML和XHTML,比XHTML寬鬆

3.HTML5有什麼變化

  • 新的語義化元素
  • 表單增強
  • 新的API(離線、音視頻、圖形、實時通信、本地存儲、設備能力)
  • 分類和嵌套變更

4.em和i有什麼區別

  • em是語義化標籤
  • i是村樣式化標籤,表示斜體
  • HTML5中i不推薦使用,一般用作圖標

5.語義化的意義是什麼

  • 開發者容易理解
  • 機器容易理解結構(搜索、讀屏軟件)
  • 有助於SEO
  • semantic microdata 

6.哪些元素可以自閉合?

  • 表單元素input
  • 圖片img
  • br hr
  • meta link

7.HTML和DOM的關係

  • HTML是‘死’的
  • DOM由HTML解析而來,是活的
  • JS可以維護DOM

8.property和attribute的區別

  • attribute是‘死’的 設計時
  • property是‘活’的 運行時

9.form的作用有哪些

  • 直接提交表單
  • 使用submit/reset按鈕
  • 便於瀏覽器保存表單
  • 第三方庫可以整體提取值
  • 第三方庫可以進行表單驗證

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章