天天看點

前端學習筆記(HTML&CSS)(02)

前端學習筆記(HTML&CSS)(02)

實體(entity)

HTML 中的預留字元必須被替換為字元實體。一些在鍵盤上找不到的字元也可以使用字元實體來替換。

如果我們需要在網頁中書寫這些特殊的符号,則需要使用html中的實體(轉義字元)

實體符合展示

<p>空格	            &nbsp; 	
   小于号  	        &lt;  	
   大于号	        &gt;	 
</p> 
<p>和号	            &amp;	  
   引号	            &quot; 	
   撇号	            &apos;   
</p>
<p>分   	        &cent; 	
   鎊	            &pound; 	
   人民币/日元	    &yen;   
</p> 	
<p>歐元	            &euro;
   小節	            &sect; 	
   版權	            &copy;	 
</p>  
<p>注冊商标	        &reg;	
   商标	            &trade;  	
   乘号	            &times; 	
   除号	            &divide;
</p>  	
           

網頁符号顯示

前端學習筆記(HTML&amp;CSS)(02)

meta标簽

meta主要用于設定網頁中的一些中繼資料,中繼資料不是給使用者看。

< meta > 元素可提供有關頁面的元資訊(meta-information),比如針對搜尋引擎和更新頻度的描述和關鍵詞。

< meta> 标簽位于文檔的頭部,不包含任何内容。< meta > 标簽的屬性定義了與文檔相關聯的名稱/值對。

  • 注釋:< meta > 标簽永遠位于 head 元素内部。
  • 注釋:中繼資料總是以名稱/值的形式被成對傳遞的。

必需的屬性

前端學習筆記(HTML&amp;CSS)(02)

content 屬性提供了名稱/值對中的值。該值可以是任何有效的字元串。

content 屬性始終要和 name 屬性或 http-equiv 屬性一起使用。

可選的屬性

前端學習筆記(HTML&amp;CSS)(02)

http-equiv 屬性

http-equiv 屬性為名稱/值對提供了名稱。并訓示伺服器在發送實際的文檔之前先在要傳送給浏覽器的 MIME 文檔頭部包含名稱/值對。

<meta http-equiv="refresh" content="3;url=https://www.bilibili.com/video/BV1XJ411X7Ud?p=20"> 
<!--将頁面重定向到另一個網站,3秒後跳轉-->
           

name 屬性

name 屬性提供了名稱/值對中的名稱。HTML 和 XHTML 标簽都沒有指定任何預先定義的 < meta > 名稱。通常情況下,您可以自由使用對自己和源文檔的讀者來說富有意義的名稱。

“keywords” 是一個經常被用到的名稱。它為文檔定義了一組關鍵字。某些搜尋引擎在遇到這些關鍵字時,會用這些關鍵字對文檔進行分類。

<!--keywords 表示網站的關鍵字,可以同時指定多個關鍵字,關鍵字間使用,隔開-->
<meta name="Keywords" content="網上購物,網上商城,手機,筆記本,電腦,MP3,CD,VCD,DV,相機,數位,配件,手表,存儲卡,京東"/>
<meta name="keywords" content="網購,網上購物,線上購物,網購網站,網購商城,購物網站,網購中心,購物中心,卓越,亞馬遜,卓越亞馬遜,亞馬遜中國,joyo,amazon">
           

description 用于指定網站的描述

<meta name="description" content="京東JD.COM-專業的綜合網上購物商城,銷售家電、數位通訊、電腦、家居百貨、服裝服飾、母嬰、圖書、食品等數萬個品牌優質商品.便捷、誠信的服務,為您提供愉悅的網上購物體驗!"/>
<!--網站的描述會顯示在搜尋引擎的搜尋的結果中-->
           

scheme 屬性

scheme 屬性用于指定要用來翻譯屬性值的方案。此方案應該在由 标簽的 profile 屬性指定的概況檔案中進行了定義。