html中的meta標籤是什麼？ meta標籤的屬性介紹-html教學-PHP中文網

本章跟大家介紹html中的meta標籤是什麼？ meta標籤的屬性介紹。有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。

什麼是meta標籤？

meta標籤是html標記head區的一個關鍵標籤，它位於HTML文檔的

和之間（有些也不是在和<title>之間）。它提供的資訊雖然使用者不可見，但卻是文件的最基本的元資訊。 meta標籤用來描述一個HTML網頁文件的屬性，例如作者、日期和時間、網頁描述、關鍵字、頁面刷新等。 <p>註：元資訊是關於資訊的訊息，元資訊允許伺服器提供所發送資料的信息，如http可以提高所發的對象語言和對象，也可以用元資訊來實現有條件請求以及報告事務完成。收到資料的瀏覽器可以根據元資訊來決定伺服器發來的是什麼內容，預料有什麼數據，確知是否接收完整的數據，以及過程中是否出錯，這樣客戶就可以知道傳輸物件的類型。 </p> <p><span style="font-size: 18px;"><strong>meta標籤的屬性有哪些？ </strong></span></p> <p> <img src="https://img.php.cn//upload/image/402/350/428/1536659975962189.jpg" title="1536659975962189.jpg" alt="html中的meta標籤是什麼？ meta標籤的屬性介紹"></p> <p><strong>屬性詳解：</strong></p> <p>1.http-equiv</p> <p>相當於http的文件頭作用，它可以向瀏覽器傳回一些有用的信息，以幫助瀏覽器正確地顯示網頁內容。 </p> <p>語法：<meta http-equiv="參數" content="參數值"></p> <p>參數：</p> <p>1) content-Type(設定頁面使用的字元集)</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><metahttp-equiv="content-Type" content="text/html;charset=gb2312"></pre><div class="contentsignin">登入後複製</div></div><p>http-equiv=Content-Type代表的是HTTP的頭部協議，提示瀏覽器網頁的訊息，</p><p>meta標籤的charset的資訊參數如GB2312時，代表說明網站是採用的編碼是簡體中文；</p><p>meta標籤的charset的資訊參數如BIG5時，代表說明網站是採用的編碼是繁體中文；</p><p>meta標籤的charset的資訊參數如iso-2022-jp時，代表說明網站是採用的編碼是日文；</p><p>meta標籤的charset的資訊參數如ks_c_5601時，代表說明網站是採用的編碼是韓文；</p><p>meta標籤的charset的資訊參數如ISO-8859-1時，代表說明網站是採用的編碼是英文；</p><p>meta標籤的charset的資訊參數如UTF-8時，代表世界通用的語言編碼；</p><p>2) content-Language（顯示語言的設定） </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta http-equiv="Content-Language" content="zh-cn"/></pre><div class="contentsignin">登入後複製</div></div><p>3) Expires(期限，可用於設定網頁的到期時間。一旦網頁過期，必須到伺服器上重新傳輸）</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta http-equiv="expires" content="Fri,12Jan200118:18:18GMT"></pre><div class="contentsignin">登入後複製</div></div><p>注意：必須使用GMT的時間格式。 </p><p>4) Pragma(cache模式，禁止瀏覽器從本機電腦的快取中存取頁面內容)</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta http-equiv="Pragma" content="no-cache"></pre><div class="contentsignin">登入後複製</div></div><p>注意：這樣設定，訪客將無法離線瀏覽。 </p><p>5) cache-control（快取設定）</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta http-equiv="cache-control" content="no-cache"></pre><div class="contentsignin">登入後複製</div></div><p>請求時的快取指令包括no-cache、no-store、max-age、max-stale、min-fresh、only- if-cached，回應訊息中的指令包括public、private、no-cache、no-store、no-transform、must-revalidate、proxy-revalidate、max-age。各個訊息中的指令意義如下:</p><p>Public指示回應可被任何快取區快取</p><p>Private指示對於單一使用者的整個或部分回應訊息，不能被共用快取處理。這允許伺服器僅描述當使用者的部分回應訊息，此回應訊息對於其他使用者的請求無效</p><p>no-cache指示請求或回應訊息不能快取</p><p>no-store用於防止重要的訊息被無意的發布。在請求訊息中發送將使得請求和回應訊息都不使用快取。 </p><p>max-age指示客戶機可以接收生存期間不大於指定時間（以秒為單位）的回應</p><p>min-fresh指示客戶機可以接收回應時間小於目前時間加上指定時間的回應</p><p>max-stale指示客戶機可以接收超出逾時期間的回應訊息。如果指定max-stale訊息的值，那麼客戶機可以接收超出超時期指定值之內的回應訊息。 </p><p>6) Refresh(自動刷新並指向新頁面）</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta http-equiv="Refresh" content="2; URL=http://www.baidu.com"> //(注意后面的引号，分别在秒数的前面和网址的后面)</pre><div class="contentsignin">登入後複製</div></div><p>注意：其中的2是指停留2秒鐘後自動刷新到URL網址。 </p><p>7) Window-target(強制頁面在目前視窗以獨立頁面顯示）<br/></p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta http-equiv="Window-target" content="_top"></pre><div class="contentsignin">登入後複製</div></div><p>注意：用來防止別人在框架裡呼叫自己的頁面。 </p><p>8) set-cookie(cookie設定，如果網頁過期，那麼記憶體的cookie將被刪除）</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta http-equiv="Set-Cookie" content="cookie value=xxx; expires=Friday,12-Jan-200118:18:18GMT；path=/"></pre><div class="contentsignin">登入後複製</div></div><p> 通常強制要求瀏覽器不設定快取重新從伺服器取得頁面會使用下面的方式：</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta http-equiv=”pragma” content=”no-cache”> <meta http-equiv=”cache-control” content=”no-cache”> <meta http-equiv=”expires” content=”0″></pre><div class="contentsignin">登入後複製</div></div><p><strong>2.name屬性</strong></p><p> name屬性主要用於描述網頁，與之對應的屬性值為content，content中的內容主要是方便搜尋引擎機器人找出資訊和分類資訊用的。 </p><p> 語法：</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta name="参数" content="具体的参数值"></pre><div class="contentsignin">登入後複製</div></div><p>Keywords(關鍵字)</p><p>說明：keywords用來告訴搜尋引擎你網頁的關鍵字是什麼。 </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta name="keywords" content=""></pre><div class="contentsignin">登入後複製</div></div><p>description(网站内容描述)</p><p>说明：description用来告诉搜索引擎你的网站主要内容。</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><metaname="description" content=""></pre><div class="contentsignin">登入後複製</div></div><p>robots(机器人向导)</p><p>说明：Meta robots标签管理着搜索引擎是否可以进入网页，你可以用它来允许或不允许搜索引擎来获取你的网页、进入你网页中的子链接或对你的网页存档。content的参数有all,none,index,noindex,follow,nofollow。默认是all。</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><metaname="robots" content="none"></pre><div class="contentsignin">登入後複製</div></div><p>具体参数如下：</p><p>信息参数为all：文件将被检索，且页面上的链接可以被查询；</p><p>信息参数为none：文件将不被检索，且页面上的链接不可以被查询；</p><p>信息参数为index：文件将被检索；</p><p>信息参数为follow：页面上的链接可以被查询；</p><p>信息参数为noindex：文件将不被检索，但页面上的链接可以被查询；</p><p>信息参数为nofollow：文件将被检索，但页面上的链接不可以被查询；</p><p>author(作者)</p><p>说明：标注网页的作者</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><metaname="author" content="jesse131work@163.com"></pre><div class="contentsignin">登入後複製</div></div><p>generator</p><p>说明：meta标签的generator的信息参数，代表说明网站的采用的什么软件制作。</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><metaname="generator" content="信息参数"/></pre><div class="contentsignin">登入後複製</div></div><p>copyright</p><p>　　说明：meta标签的copyright的信息参数，代表说明网站版权信息。</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><metaname="copyright" content="信息参数"></pre><div class="contentsignin">登入後複製</div></div><p>revisit-after</p><p>　　说明：revisit-after代表网站重访,7days代表7天，依此类推，假如我设置，那这样搜索引擎就是7天来一次。使用这个标签的网站，通常是因为网站数据量非常大，被搜索引擎过于频繁的抓取，会占用过大的资源，影响网站的访问。所以，希望搜索引擎不要天天过来，抓取过一次了，那么等7天后再来。一般的网站是不需要这个标签的。</p><p><meta name="revisit-after" content="7days"></p><p>view-point</p><p>　　说明：主要影响移动页面布局</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><meta name="viewport" content="width=device-width, initial-scale=1.0"></pre><div class="contentsignin">登入後複製</div></div><p>content 参数：</p><p>width viewport 宽度(数值/device-width)</p><p>height viewport 高度(数值/device-height)</p><p>initial-scale 初始缩放比例</p><p>maximum-scale 最大缩放比例</p><p>minimum-scale 最小缩放比例</p><p>user-scalable 是否允许用户缩放(yes/no)</p><p><strong>3.content属性</strong></p><p> content属性一般与name和http-equiv属性一起用，视它们的值而定。</p><p><strong>4.charset属性</strong></p><p>charset属性，是html5的属性，可替换<metahttp-equiv="content-Type" content="text/html;charset=gb2312">设置为<meta charset="utf-8"></p><p>设置meta属性的作用是什么？</p><p> meta标签提供关于HTML文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。它可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。meta标签可用于缓存设置，还与SEO优化相关。SEO是指通过采用易于搜索引擎索引的合理手段，使网站各项基本要素适合搜索引擎检索原则并且对用户更友好（Search Engine Friendly），从而更容易被搜索引擎收录及优先排序从属于SEM（搜索引擎营销）。通俗理解是：通过总结搜索引擎的排名规律，对网站进行合理优化，使你的网站在百度和goog的排名提高，让搜索引擎给你带来客户。</p><p> seo优化常用语句如下</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"> <title>your title</title>  <meta name="keywords" content="your keywords">  <meta name="description" content="your description">  <meta name="author" content="author,email address">  <meta name="robots" content="index,follow"></pre><div class="contentsignin">登入後複製</div></div>

以上是html中的meta標籤是什麼？ meta標籤的屬性介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！