HTML <style> Tag
Voorbeeld
Gebruik van die <style>-element om 'n eenvoudige stylblad op 'n HTML-dokument toe te pas:
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
</head>
<body>
<h1>A heading</h1>
<p>A paragraph.</p>
</body>
</html>
Meer "Probeer dit self" voorbeelde hieronder.
Definisie en gebruik
Die <style>
merker word gebruik om stylinligting (CSS) vir 'n dokument te definieer.
Binne die <style>
element spesifiseer jy hoe HTML-elemente in 'n blaaier moet weergee.
Wenke en notas
Let wel: Wanneer 'n blaaier 'n stylblad lees, sal dit die HTML-dokument formateer volgens die inligting in die stylblad. As sommige eienskappe vir dieselfde keurder (element) in verskillende stylblaaie gedefinieer is, sal die waarde van die laaste gelees stylblad gebruik word (sien voorbeeld hieronder)!
Wenk: Om na 'n eksterne stylblad te skakel, gebruik die <link> -merker.
Wenk: Lees asseblief ons CSS -tutoriaal om meer oor stylblaaie te wete te kom .
Blaaierondersteuning
Element | |||||
---|---|---|---|---|---|
<style> | Yes | Yes | Yes | Yes | Yes |
Eienskappe
Attribute | Value | Description |
---|---|---|
media | media_query | Specifies what media/device the media resource is optimized for |
type | text/css | Specifies the media type of the <style> tag |
Globale eienskappe
Die <style>
merker ondersteun ook die Global Attributes in HTML .
Gebeurtenis eienskappe
Die <style>
merker ondersteun ook die gebeurteniskenmerke in HTML .
Meer voorbeelde
Voorbeeld
Veelvuldige style vir dieselfde elemente:
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
<style>
h1 {color:green;}
p {color:pink;}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This
is a paragraph.</p>
</body>
</html>
Verwante bladsye
HTML-tutoriaal: HTML CSS
CSS-tutoriaal: CSS-tutoriaal
HTML DOM verwysing: Style Object
Verstek CSS-instellings
Die meeste blaaiers sal die <style>
element met die volgende verstekwaardes vertoon:
style {
display: none;
}