怎么使用html中meta標(biāo)簽

本篇內(nèi)容主要講解“怎么使用html中meta標(biāo)簽”,感興趣的朋友不妨來看看。本文介紹的方法操作簡(jiǎn)單快捷,實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“怎么使用html中meta標(biāo)簽”吧!

站在用戶的角度思考問題,與客戶深入溝通,找到施秉網(wǎng)站設(shè)計(jì)與施秉網(wǎng)站推廣的解決方案,憑借多年的經(jīng)驗(yàn),讓設(shè)計(jì)與互聯(lián)網(wǎng)技術(shù)結(jié)合,創(chuàng)造個(gè)性化、用戶體驗(yàn)好的作品,建站類型包括:網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣、主機(jī)域名、網(wǎng)頁空間、企業(yè)郵箱。業(yè)務(wù)覆蓋施秉地區(qū)。

一、meta標(biāo)簽 含義

<meta> 元素 可提供有關(guān)頁面的元信息(meta-information),比如針對(duì)搜索引擎和更新頻度的描述和關(guān)鍵詞。

<meta> 標(biāo)簽位于文檔的頭部,不包含任何內(nèi)容。

<meta> 標(biāo)簽的屬性定義了與文檔相關(guān)聯(lián)的名稱/值對(duì)。

二、meta 中常用屬性

1. charset  (字符集)

說明:規(guī)定 HTML 文檔的字符編碼。

用法: <meta charset="UTF-8">  

2.  viewport (視區(qū))

說明:是用戶網(wǎng)頁的可視區(qū)域。 大家都知道移動(dòng)設(shè)備的屏幕一般都比PC小很多,webkit瀏覽器會(huì)將一個(gè)較大的“虛擬”窗口映射到移動(dòng)設(shè)備的屏幕上,默認(rèn)的虛擬窗口為980像素寬(目前大部分網(wǎng)站的標(biāo)準(zhǔn)寬度),然后按一定的比例(3:1或2:1)進(jìn)行縮放。

 也就是說當(dāng)我們加載一個(gè)普通網(wǎng)頁的時(shí)候,webkit會(huì)先以980像素的瀏覽器標(biāo)準(zhǔn)加載網(wǎng)頁,然后再縮小為490像素的寬度。注意這個(gè)縮小是一個(gè)全局縮小,也就是頁面上的所有元素都會(huì)縮小。

用法:

1、<meta id="viewport" name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1; user-scalable=no;">

(1)  width

width 控制 viewport 的大小,一般為了自適應(yīng)設(shè)置為device-width

(2) initial-scale

  initial-scale:初始縮放比例,也即是當(dāng)頁面第一次 load 的時(shí)候縮放比例。

        (3) maximum-scale

  maximum-scale 最大縮放。即允許的最大縮放程度。這也是一個(gè)浮點(diǎn)值,用以指出頁面大小與屏幕大小相比的最大乘數(shù)。

(4)  minimum-scale

minimum-scale:允許用戶縮放到的最小比例。和 maximum-scale 用法類似。

(5)  user-scalable

user-scalable 用戶調(diào)整縮放。即用戶是否能改變頁面縮放程度。如果設(shè)置為yes則是允許用戶對(duì)其進(jìn)行改變,反之為no。

3. keywords (關(guān)鍵字)

說明:為搜索引擎提供的關(guān)鍵字列表。各關(guān)鍵詞間用英文逗號(hào)“,”隔開。指定搜索引擎用來提高搜索質(zhì)量的關(guān)鍵詞。

用法:<Meta name="Keywords" Content="關(guān)鍵詞1,關(guān)鍵詞2,關(guān)鍵詞3,關(guān)鍵詞4,……">

4. description (描述、簡(jiǎn)介)
 

說明:Description用來告訴搜索引擎你的網(wǎng)站主要內(nèi)容。
 

用法:<Meta name="Description" Content="你網(wǎng)頁的簡(jiǎn)述">

5. format-detection (格式檢測(cè))

說明:format-detection 是用來檢測(cè)html里的一些格式的。

用法:關(guān)于meta的format-detection屬性主要是有以下幾個(gè)設(shè)置:    
 

1、meta name="format-detection" content="telephone=no"

2、   meta name="format-detection" content="email=no"

3、   meta name="format-detection" content="adress=no"

也可以連寫:meta name="format-detection" content="telephone=no,email=no,adress=no"

(1)telephone
 

你明明寫的一串?dāng)?shù)字沒加鏈接樣式,而iPhone會(huì)自動(dòng)把你這個(gè)文字加鏈接樣式、并且點(diǎn)擊這個(gè)數(shù)字還會(huì)自動(dòng)撥號(hào)!想去掉這個(gè)撥號(hào)鏈接該如何操作呢?這時(shí)我們的meta又該大顯神通了,代碼如下:

telephone=no就禁止了把數(shù)字轉(zhuǎn)化為撥號(hào)鏈接!
  telephone=yes就開啟了把數(shù)字轉(zhuǎn)化為撥號(hào)鏈接,要開啟轉(zhuǎn)化功能,這個(gè)meta就不用寫了,在默認(rèn)是情況下就是開啟!

(2)email

告訴設(shè)備不識(shí)別郵箱,點(diǎn)擊之后不自動(dòng)發(fā)送

email=no禁止作為郵箱地址!
  email=yes就開啟了把文字默認(rèn)為郵箱地址,這個(gè)meta就不用寫了,在默認(rèn)是情況下就是開啟!

(3)adress

adress=no禁止跳轉(zhuǎn)至地圖!
  adress=yes就開啟了點(diǎn)擊地址直接跳轉(zhuǎn)至地圖的功能,在默認(rèn)是情況下就是開啟!

6. apple-touch-fullscreen

說明:添加到主屏幕后,全屏顯示。

用法:<meta name="apple-touch-fullscreen" content="yes">

7.  apple-mobile-web-app-capable

說明: 作用就是刪除默認(rèn)的蘋果工具欄和菜單欄。content有兩個(gè)值”yes”和”no”,當(dāng)我們需要顯示工具欄和菜單欄時(shí),這個(gè)行meta就不用加了,默認(rèn)就是顯示。

用法:<meta name="apple-mobile-web-app-capable" content="yes" />

8.  App-Config

說明:保留歷史記錄以及動(dòng)畫效果

用法:<meta name="App-Config" content="fullscreen=yes,useHistoryState=yes,transition=yes"/>

9. msapplication-tap-highlight

  說明:點(diǎn)擊無高光(高亮)

用法:<meta name="msapplication-tap-highlight" content="no">

到此,相信大家對(duì)“怎么使用html中meta標(biāo)簽”有了更深的了解,不妨來實(shí)際操作一番吧!這里是創(chuàng)新互聯(lián)網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!

新聞標(biāo)題:怎么使用html中meta標(biāo)簽
鏈接地址:http://muchs.cn/article10/gedddo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供定制開發(fā)、企業(yè)網(wǎng)站制作、域名注冊(cè)、虛擬主機(jī)、微信公眾號(hào)、微信小程序

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

網(wǎng)站托管運(yùn)營(yíng)