Rumah >hujung hadapan web >Tutorial H5 >Contoh untuk menerangkan beberapa aplikasi teg meta HTML5 _html5 kemahiran tutorial

Contoh untuk menerangkan beberapa aplikasi teg meta HTML5 _html5 kemahiran tutorial

WBOY
WBOYasal
2016-05-16 15:46:071918semak imbas

Perbezaan utama dalam penggunaan tag meta antara HTML 4.01 dan HTML 5:

Dalam HTML 5, atribut skema tidak lagi disokong.

Dalam HTML 5, terdapat atribut set aksara baharu yang menjadikan definisi set aksara lebih mudah.

Dalam HTML 4.01, anda perlu menulis:

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <meta http-equiv="jenis kandungan " kandungan="text/html; charset=ISO-8859-1">

Dalam HTML 5, ini sudah memadai:

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <meta charset="ISO-8859-1 "> 

Contoh

Tentukan kata kunci untuk enjin carian:

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <meta nama="kata kunci" kandungan="HTML, CSS, XML, XHTML, JavaScript" />

Tentukan perihalan halaman:

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <meta nama="penerangan" kandungan="Tutorial teknologi web percuma." />

Versi terkini halaman definisi:

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <meta nama="disemak" kandungan="David, 2008/8/8/" />

Muat semula halaman setiap 5 saat:

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <meta http-equiv="refresh" kandungan="5" />

Atribut
2015128114639927.png (639×396)

Sifat Standard

kelas, contenteditable, contextmenu, dir, draggable, id, tidak relevan, lang, ref, registrationmark, tabindex, template, title Untuk penerangan lengkap, sila lawati Standard Properties dalam HTML 5.

Hartanah Acara

onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu, ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart, ondrop, onerror, onfocus, onkeydown, onkeypress, onkeyup, onload, onmessage, ondragemous overmouse , onmouseout, onmouseup, onmousewheel, onresize, onscroll, onselect, onsubmit, onunload Untuk penerangan lengkap, sila lawati atribut acara dalam HTML 5.

Contoh

Penerangan Dokumen

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <html>
  2. <kepala>
  3. <meta http-equiv=" Jenis Kandungan" kandungan="teks/html; charset=gb2312" />
  4. <meta nama="pengarang" kandungan="w3school.com.cn">
  5. <meta nama="disemak" kandungan="David Yang,8/1/07">
  6. <meta nama="penjana" kandungan="Dreamweaver 8.0en">
  7. kepala>
  8. <badan>
  9. <p>Atribut meta dokumen ini mengenal pasti pengarang dan perisian penyuntingan. p>
  10. badan>
  11. html>
Maklumat dalam

elemen Meta menerangkan dokumen HTML.

Kata Kunci Dokumen

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <html>  
  2. <kepala>  
  3. <meta http-equiv=" Jenis Kandungan" kandungan="teks/html;  charset=gb2312" />  
  4. <meta nama="penerangan"  kandungan="Contoh HTML">  
  5. <meta nama="kata kunci"  kandungan="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">  
  6. kepala>  
  7. <badan>  
  8. <p>本文档的 meta 属性描述了该文宔的。 p>  
  9. badan>  
  10. html>  

Meta 元素中的信息可以描述文档的关键词。

重定向

Kod XML/HTML复制内容到剪贴板
  1. <html>  
  2. <kepala>  
  3. <meta http-equiv=" Jenis Kandungan" kandungan="teks/html;  charset=gb2312" />  
  4. <meta http-equiv=" Muat semula" kandungan="5;url=http://www.w3school.com.cn">  
  5. kepala>  
  6. <badan>  
  7. <p>  
  8. 对不起。我们已经搬家了。您的 URL 是 <ah >h > ="http://www.w3school.com.cn"> http://www.w3school.com.cn a>
  9.    p>
  10.    <p>您将在 5 秒内被重定向到新的定向到新。 🎜>p>
  11.   
  12. <p>如果超过 5 秒后您仍然秒后您仍然看切的的链接。p>
  13.   
  14. badan>
  15.   
  16. html>
  17.   

这个例子演示:在网址已经变更的情况下,将用户重定向到另外一个地厀>。

移动前端开发中添加一些webkit专属的HTML5头部标签,帮助浏览器更好解析html代小端页面表现出来。本文整理一些常用的meta标签。
Kod XML/HTML复制内容到剪贴板
  1. >
  2. <kepala>
  3.  <meta charset='utf- 8'> 
  4. " X-ua-compatible "
  5. Kandungan = " IE = Edge, Chrome = 1 "/& gt; 🎜>  <meta
  6. nama="penerangan"
  7. kandungan="Tidak lebih daripada 150 aksara"/>  <meta
  8. nama="kata kunci"
  9. kandungan=""/>  <meta
  10. nama="pengarang"
  11. kandungan="nama, e-mel@gmail.com"/>  <meta
  12. nama="robot"
  13. kandungan="indeks,ikut"/>
  14.  <meta nama="viewport" kandungan="initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no "> 
  15.  <meta nama="epal- mobile-web-app-title" kandungan="tajuk">
  16.  <meta nama="epal- mobile-web-app-capable" kandungan="ya"/>
  17.  <meta nama="epal- itunes-app" kandungan="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL"> 
  18.  <meta nama="epal- mobile-web-app-status-bar-style" kandungan="hitam"/>
  19.  <meta nama="format- pengesanan" kandungan="telphone=no, email=no"/>
  20.  <meta nama="penyampai" kandungan="webkit">
  21. " " >
  22. " Kawalan Cache" kandungan="tiada aplikasi tapak" /> ;
  23.  
  24. <meta nama="Mesra Tangan" kandungan="benar">
  25.  
  26. <
  27. meta nama="MobileOptimized" kandungan="320">
  28.  
  29. <
  30. meta nama="skrin- orientasi" kandungan="potret">
  31.  
  32. <
  33. meta nama="x5- orientasi" kandungan="potret">
  34.  
  35. <
  36. meta nama="penuh- skrin" kandungan="ya">
  37.  <meta nama="x5- skrin penuh" kandungan="benar">
  38.  <meta nama="mod pelayar" kandungan="aplikasi">
  39.  <meta nama="x5- mod halaman" kandungan="aplikasi">
  40.  <meta nama="msapplication- ketik-serlah" kandungan="tidak">
  41.  <pautan rel="epal- touch-icon-precomposed" href="/apple-touch-icon-57x57-precomposed.png"/> 
  42.  <pautan rel="epal- touch-icon-precomposed" saiz="114x114" href="/apple-touch-icon-114x114-precomposed.png"/>
  43.  <pautan rel="epal- touch-startup-image" saiz="768x1004" href="/splash-screen-768x1004.png"/>
  44.  <pautan rel="epal- touch-startup-image" saiz="1536x2008" href="/splash-screen-1536x2008.png"/>
  45.  <pautan rel="epal- touch-startup-image" saiz="1024x748" href="/Default-Portrait-1024x748.png"/>
  46.  <pautan rel="epal- touch-startup-image" saiz="2048x1496" href="/splash-screen-2048x1496.png"/>
  47.  <pautan rel="epal- touch-startup-image" href="/splash-screen-320x480.png"/> ;
  48.  <pautan rel="epal- touch-startup-image" saiz="640x960" href="/splash-screen-640x960.png"/> 
  49.  <pautan rel="epal- touch-startup-image" saiz="640x1136" href="/splash-screen-640x1136.png"/> 
  50.  
  51.  <meta nama="msapplication- TileColor" kandungan="#000"/>
  52.  <meta nama="msapplication- TileImage" kandungan="icon.png"/>
  53.  <pautan rel="ganti" taip="aplikasi/rss xml" tajuk="RSS" href="/rss.xml"/ >
  54.  <pautan rel="ikon pintasan " taip="imej/ico" href="/favicon.ico"/>
  55.  <meta harta benda="og: taip" kandungan="taip" />
  56.  <meta property="og: url" Inhalt="URL-Adresse" />
  57.  <meta property="og: title" content="title" />
  58.  <meta property="og: image" content="image" />
  59.  <meta property="og: Beschreibung" Inhalt="Beschreibung" />
  60.  <Titel>TitelTitel>
  61. Kopf>
Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn