1. 程式人生 > >HEAD標簽中的常用標簽

HEAD標簽中的常用標簽

con title sch att tex 查看 ext tle tro

目錄

  • 知識點
  • 知識點詳解
    • 0x01 HTML的主體結構
    • 0x02 HEAD標簽中的常用標簽

知識點

  1. HTML的主體結構
  2. HEAD標簽中的常用標簽

知識點詳解

0x01 HTML的主體結構

HTML的主體結構分為兩大部分:最頂部聲明和HTML標簽。其中,HTML標簽又包含HEAD與BODY兩個標簽。

<!DOCTYPE html>   <!-- //最頂部聲明,告訴瀏覽器所使用的HTML規範 -->
<html>    <!--//html標簽開始-->
    <head></head>    <!--//head標簽-->
    <body></body>   <!-- //body標簽-->
</html>    <!--//html標簽結束-->

0x02 HEAD標簽中的常用標簽

HEAD中標簽所起的作用,大多數不能直接在頁面顯現出來。如果你要看自己所配置的代碼,可右擊瀏覽器->選擇查看頁面源代碼進行查看。

  • <title></title> 設置網頁的標題
  • <meta /> 對頁面進行描述
    • 屬性
      • http-equiv 告知瀏覽器的行為
        取值:
        content-type
        refresh
      • name 告知瀏覽器的內容
        取值:
        keywords
        description
  • <link /> 定義兩個文檔之間連接的關系(文獻)
    • 屬性
      • rel 文檔與被鏈接文檔之間的關系
      • type 被鏈接文檔的類型
      • href 被鏈接文檔的地址
        註意:href中會涉及到文件的地址,地址設置分為絕對路徑和相對路徑。
        絕對路徑:相當於回到起點重新開辟另一條道路。比如www.cnblogs.com/jingbai/p/http-url.html。
        相對路徑:相當於以現在的路徑作為起點去設置路徑。
        ./ 表示當前目錄; ../ 表示上一級目錄
      <!DOCTYPE html>
      <html>
        <head>
        <title>meta標簽</title>    <!--//需要設置頁面的字符集,不然標題會亂碼-->
        <meta charset="utf-8" />    <!--//設置頁面的字符集-->
        <meta http-equiv="content-type" content="text/html;charset=utf-8"/>    <!--//設置頁面字符集的另一種方法-->
        <meta http-equiv="refresh" content="5" />    <!--//設置頁面自動刷新,“5”代表每隔5秒進行自動刷新一次-->
        <meta name="keywords" content="這裏是關鍵字描述的地方" />    <!--//設置網站的關鍵字-->
        <meta name="description" content="這裏是對於網站進行描述的地方,可以詳細的敘述所建網站的作用,目的等" />    <!--//設置網站的詳細描述-->
        <link rel="icon" type="image/jpg" href="./a.jpg"/>    <!--//設置網頁標題標題的logo-->
        </head>
        <body>
        </body>
      </html>
  • <script></script> 加載JS腳本
  • <style></style> 加載CSS樣式

HEAD標簽中的常用標簽