Tag <style> dalam HTML adalah tag yang digunakan untuk mendefinisikan gaya atau tampilan dari halaman web. Dengan menggunakan tag ini, pengguna dapat mengontrol bagaimana elemen-elemen pada halaman web akan ditampilkan, termasuk ukuran, warna, tata letak, dan bentuk.
Pada dasarnya, tag <style> digunakan untuk menulis kode CSS (Cascading Style Sheets) di dalam dokumen HTML. CSS adalah bahasa pemrograman yang digunakan untuk mengatur tampilan dan format dari halaman web. Dengan menggunakan CSS, pengguna dapat memisahkan tampilan dan struktur dari dokumen HTML, sehingga membuat kode lebih mudah dipelihara dan dikelola.
Salah satu keuntungan utama dari menggunakan tag <style> adalah pengguna dapat memisahkan kode gaya dari kode HTML. Ini berarti bahwa ketika pengguna ingin mengubah tampilan dari halaman web, mereka hanya perlu memodifikasi kode CSS, tanpa perlu mengubah kode HTML yang mendasarinya. Ini membuat pengembangan dan perawatan halaman web menjadi lebih mudah dan efisien.
Tag <style> biasanya ditempatkan di antara tag <head> dan </head> pada dokumen HTML. Ini berarti bahwa kode CSS yang dituliskan di dalam tag <style> hanya akan diterapkan pada halaman web yang sama, dan tidak akan berdampak pada halaman web lain yang terhubung.
Berikut adalah contoh sederhana penggunaan tag <style> dalam HTML:
<html>
<head>
<title>Contoh Penggunaan Tag Style</title>
<style>
body {
background-color: #f5f5f5;
font-family: Arial, sans-serif;
font-size: 14px;
color: #333;
}
h1 {
font-size: 24px;
color: #666;
text-align: center;
margin-top: 50px;
}
</style>
</head>
<body>
<h1>Selamat Datang di Website Tunadi.id</h1>
<p>Ini adalah contoh halaman web sederhana dengan menggunakan tag style.</p>
</body>
</html>
Dalam contoh di atas, kode CSS di dalam tag <style> diterapkan pada seluruh halaman web. Kode CSS tersebut mendefinisikan tampilan untuk elemen body dan h1. Elemen body akan memiliki latar belakang warna #f5f5f5, font Arial dengan ukuran 14px, dan warna teks #333. Sedangkan elemen h1 akan memiliki font-size 24px, warna teks #666, dan margin-top sebesar 50px.
Ketika halaman web tersebut dijalankan di browser, maka tampilan halaman web akan diatur sesuai dengan kode CSS yang didefinisikan di dalam tag <style>. Dengan menggunakan tag <style>, pengguna dapat mengontrol tampilan dan format dari halaman web, serta membuatnya terlihat lebih menarik dan profesional.

0 Comments