Skodev
Belajar coding dalam bahasa Indonesia
Diskon kelas baru hingga 25%! Masukkan kupon "lebihcepat" di kelas ini
XSkodev
Belajar coding dalam bahasa Indonesia
Daftar Isi:
Saat membuat sebuah website, kamu tentu ingin tampilan situs milikmu menarik dan profesional bukan? Untuk merealisasikannya, kamu perlu menggunakan CSS (Cascading Style Sheet) yang dapat mempercantik dan memodifikasi tampilan HTML. Agar lebih jelas, yuk simak cara memanggil CSS di HTML berikut ini.
Metode ini memungkinkan kamu untuk menerapkan CSS pada elemen HTML secara khusus. Caranya yaitu dengan langsung menuliskan atribut style di dalam tag HTML.
Contoh kode:
<p style="color:red;">Ini adalah teks berwarna merah</p>Dengan metode inline style, CSS hanya berlaku pada elemen tersebut saja dan tidak mempengaruhi elemen lainnya.
Untuk menerapkan CSS pada lebih dari satu elemen subyek di halaman yang sama, kamu bisa memanfaatkan metode internal style sheet. Caranya yaitu dengan menuliskan kode CSS di dalam tag
Contoh kode:
<head>
<style>
p {
color: red;
}
</style>
</head>
<body>
<p>Ini adalah teks berwarna merah</p>
</body>Dengan metode ini, CSS akan berlaku pada semua elemen yang sama di dalam halaman tersebut.
Jika kamu ingin menerapkan gaya tampilan yang sama pada beberapa halaman, cara yang paling efisien ialah menggunakan metode external style sheet. Caranya yaitu dengan menuliskan kode CSS pada sebuah file terpisah lalu memanggilnya di dalam halaman HTML menggunakan tag .
Contoh kode:
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>Pada file “style.css” kita bisa menulis kode CSS, misalnya:
p {
color: red;
}Dalam hal ini style.css harus berada di dalam direktori yang sama dengan file HTML kamu.
Menggunakan metode ini, kamu dapat dengan mudah memodifikasi tampilan situs secara keseluruhan dengan merubah kode pada satu file CSS saja. Metode ini juga akan membuat kode HTML menjadi lebih rapi dan mudah dipahami karena kodenya cukup dipanggil, bukan ditulis satu persatu di tiap halaman.
Mengetahui cara memanggil CSS di HTML ini sangat penting untuk tujuan estetika dan efisiensi dalam pembuatan website. Dengan pengetahuan ini, kamu dapat merancang situs web yang menarik dan profesional dengan lebih mudah dan efisien. Selamat mencoba!
belajar membuat website kamu dari nol. Cocok untuk pemula
Lihat KelasLink terkait: