Tag <style> HTML
Contoh
Penggunaan elemen <style> untuk menerapkan style sheet sederhana ke dokumen HTML:
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
</head>
<body>
<h1>A heading</h1>
<p>A paragraph.</p>
</body>
</html>
Lebih banyak contoh "Coba Sendiri" di bawah ini.
Definisi dan Penggunaan
Tag <style>
digunakan untuk mendefinisikan informasi gaya (CSS) untuk sebuah dokumen.
Di dalam <style>
elemen, Anda menentukan bagaimana elemen HTML harus dirender di browser.
Tips dan Catatan
Catatan: Saat browser membaca style sheet, itu akan memformat dokumen HTML sesuai dengan informasi di style sheet. Jika beberapa properti telah ditentukan untuk pemilih (elemen) yang sama di lembar gaya yang berbeda, nilai dari lembar gaya yang terakhir dibaca akan digunakan (lihat contoh di bawah)!
Tip: Untuk menautkan ke lembar gaya eksternal, gunakan tag <link> .
Tip: Untuk mempelajari lebih lanjut tentang style sheet, silakan baca Tutorial CSS kami .
Dukungan Peramban
Element | |||||
---|---|---|---|---|---|
<style> | Yes | Yes | Yes | Yes | Yes |
Atribut
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 |
Atribut Global
Tag <style>
juga mendukung Atribut Global dalam HTML .
Atribut Acara
Tag <style>
juga mendukung Atribut Peristiwa dalam HTML .
Lebih Banyak Contoh
Contoh
Beberapa gaya untuk elemen yang sama:
<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>
Halaman Terkait
Tutorial HTML: HTML CSS
Tutorial CSS : Tutorial CSS
Referensi DOM HTML: Objek Gaya
Pengaturan CSS Default
Sebagian besar browser akan menampilkan <style>
elemen dengan nilai default berikut:
style {
display: none;
}