HTML <meta> Tag
Voorbeeld
Beskryf metadata binne 'n HTML-dokument:
<head>
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="author" content="John Doe">
<meta
name="viewport" content="width=device-width, initial-scale=1.0">
</head>
Meer "Probeer dit self" voorbeelde hieronder.
Definisie en gebruik
Die <meta>
merker definieer metadata oor 'n HTML-dokument. Metadata is data (inligting) oor data.
<meta>
merkers gaan altyd binne die <head>-element, en word tipies gebruik om karakterstel, bladsybeskrywing, sleutelwoorde, outeur van die dokument en viewport-instellings te spesifiseer.
Metadata sal nie op die bladsy vertoon word nie, maar is masjienontleedbaar.
Metadata word gebruik deur blaaiers (hoe om inhoud te vertoon of bladsy te herlaai), soekenjins (sleutelwoorde) en ander webdienste.
Daar is 'n metode om webontwerpers toe te laat om beheer te neem oor die uitsigpoort (die gebruiker se sigbare area van 'n webblad), deur die <meta>
merker (Sien "Stel die uitsigpoort"-voorbeeld hieronder).
Blaaierondersteuning
Element | |||||
---|---|---|---|---|---|
<meta> | Yes | Yes | Yes | Yes | Yes |
Eienskappe
Attribute | Value | Description |
---|---|---|
charset | character_set | Specifies the character encoding for the HTML document |
content | text | Specifies the value associated with the http-equiv or name attribute |
http-equiv | content-security-policy content-type default-style refresh |
Provides an HTTP header for the information/value of the content attribute |
name | application-name author description generator keywords viewport |
Specifies a name for the metadata |
Globale eienskappe
Die <meta>
merker ondersteun ook die Global Attributes in HTML .
Meer voorbeelde
Definieer sleutelwoorde vir soekenjins:
<meta name="keywords" content="HTML, CSS, JavaScript">
Definieer 'n beskrywing van jou webblad:
<meta name="description" content="Free Web tutorials for
HTML and CSS">
Definieer die skrywer van 'n bladsy:
<meta name="author" content="John Doe">
Herlaai dokument elke 30 sekondes:
<meta http-equiv="refresh" content="30">
Stel die viewport om jou webwerf goed te laat lyk op alle toestelle:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Stel die uitsigpoort
Die viewport is die gebruiker se sigbare area van 'n webblad. Dit verskil met die toestel – dit sal kleiner wees op 'n selfoon as op 'n rekenaarskerm.
Jy moet die volgende <meta>
element by al jou webblaaie insluit:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Dit gee die blaaier instruksies oor hoe om die bladsy se afmetings en skaal te beheer.
Die width=device-width
deel stel die breedte van die bladsy in om die skermwydte van die toestel te volg (wat sal wissel na gelang van die toestel).
Die initial-scale=1.0
deel stel die aanvanklike zoomvlak in wanneer die bladsy die eerste keer deur die blaaier gelaai word.
Hier is 'n voorbeeld van 'n webbladsy sonder die viewport-metamerker, en dieselfde webbladsy met die viewport-metamerker:
Wenk: As jy deur hierdie bladsy met 'n foon of tablet blaai, kan jy op die twee skakels hieronder klik om die verskil te sien.
Jy kan meer lees oor die uitsigpoort in ons Responsiewe webontwerp - Die uitsig-tutoriaal .
Verwante bladsye
HTML-tutoriaal: HTML Head
HTML DOM verwysing: Meta Object
Verstek CSS-instellings
Geen.