HTML基礎-認識HTML

HTML是什么

  • HTML是HyperText Markup Language的縮寫,超文本標記語言。

HTML的作用

  • 在純文本文件中,所有的文字都是同級別的,HTML只有一個作用:專門用來描述文本的語義,也就是說可以通過HTML告訴瀏覽器哪些是標簽,哪些是段落。這些用于描述其他文本語義的文本稱為標簽,且標簽不會在瀏覽器中顯示出來。
  • 因為這些標簽是專門用來描述其他文本語義的,且在瀏覽器中不顯示,因此稱為“超文本”,又因為這些文本叫標簽,所以HTML被稱為“超文本標記語言”。

網頁的固定格式

  • 編寫網頁有一套規范和要求,規定了寫網頁的格式。
  • 基本結構:
<html>
    <head>
        <title></title>
    </head>
    <body>
    </body>
</html>
  • 通過觀察可以發現,HTML基本結構中的標簽大部分都是成對出現的,不帶/的標簽稱為開始標簽,帶/的標簽稱為結束標簽。

html標簽

  • 作用:告訴瀏覽器這是一個HTML文檔。
  • 注意點:所有標簽都必須寫在html開始與結束標簽之間。

head標簽

  • 作用:
    • 用于給網站添加配置信息
    • 例如:
      • 指定網站的標題/指定網站的小圖片
      • 添加網站的SEO相關的信息(指定網站的關鍵字/制定網站的描述信息)
      • 外掛一些外部的css/js文件
        添加一些瀏覽器適配相關的內容
  • 注意點:
    • 一般情況下,head標簽內的內容不會顯示給用戶看

title標簽

  • 作用:
    • 專門用于指定網站的標題,且作為保存網站的默認標題
    • 注意點:必須寫在head標簽內

body標簽

  • 作用:
    • 專門用于 定義HTML文檔中顯示給用戶查看的內容
  • 注意點:
    • 一定要將需要顯示的內容寫在body中
    • 一對<html></html>中只能有一對<body></body>標簽

head內部標簽

meta標簽

  • meta標簽的作用,就是指定當前網頁的字符集
  • 為什么會有亂碼的現象?
    • 編寫網頁時沒有指定字符集
  • 如何解決亂碼現象?
    -在head標簽中添加“<meta charset="GBK(UTF-8)"/>”,指定字符集
  • 什么是字符集?
    • 字符的集合,很多字符堆在一起。
  • GBK(GB2312)和UTF-8區別
    • GBK(GB2312)僅僅存儲一些漢字及常用外文
      • 體積較小
    • UTF-8存儲世界上所有文字
      -體積較大
  • 懶人推薦:不管三七二十一,一律用UTF-8

標簽分類

  • 單標簽
    • 只有開始標簽沒有結束標簽
<meta charset="UTF-8"/>
  • 雙標簽
    • 又開始標簽和結束標簽
<html>
</html>

HTML標簽關系分類

  • 并列關系(兄弟/平級)
      <head>
      </head>
      <body>
      </body>
  • 嵌套關系(父子/上下級)
<head>
            <meta charset="UTF-8"/>
            <title></title>
</head>

DTD文檔聲明

  • 什么是DTD文檔聲明?
    • 由于HTML有多個版本的規范,我們需要在HYML文件的第一行告訴瀏覽器我們要用哪個版本的規范來編寫,瀏覽器知道我們用那個版本后,就能正確的編譯/解析/渲染我們的網頁
  • DTD文檔聲明格式?
    • 每一個不同版本的規范都有不同的DTD文檔聲明
    • 現在一般使用HTML5的DTD文檔聲明,因為它是向下兼容的
      格式:
<!DOCTYPE html>
  • DTD文檔聲明的注意點:
    • 任何一個標準的HTML網頁的第一行一定是DTD文檔聲明
    • DTD文檔不區分大小寫
    • DTD文檔聲明不是標簽
    • 瀏覽器不會完全依賴DTD文檔聲明,瀏覽器有一套自己的機制,第一行寫DTD是遵守規定
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • ## HTML基礎-認識HTML # head標簽 # title標簽 # body標簽 # meta標簽(字符集...
    KsKison閱讀 505評論 0 2
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,801評論 1 92
  • 什么是HTML HTML其實是HyperText Markup Language的縮寫, 超文本標記語言 HTML...
    cheney0217閱讀 437評論 0 1
  • 什么是HTML HTML其實是HyperText Markup Language的縮寫, 超文本標記語言 HTM...
    極客江南閱讀 21,945評論 29 196
  • PostCSS介紹 PostCSS本身是一個功能單一的工具,提供了用JavaScript處理CSS的方法。它負責把...
    尾巴尾巴尾巴閱讀 322評論 0 0