Web adalah dokumen yang diakses melalui internet menggunakan web browser dengan mengetikkan URL atau mengklik link untuk laman web tersebut. terdapat dua teknologi utama untuk membuat laman web (web pages) bagi kamu yang senang berselancar di internet yaitu HTML dan CSS. Keduanya mempunyai peran berbeda namun tidak terpisahkan dalam pembuatan laman web modern.
Sebuah laman web, HTML berperan untuk menentukan struktur dan tipe konten
seperti paragraf, heading, list dan image, sedangkan CSS lebih ke penyajian
struktur dan konten agar lebih menarik seperti layout, color, margin, padding,
font-family dan alignment. Tanpa CSS, Anda tetap bisa menyajikan konten di
laman web namun dengan tampilan yang tidak menarik.
CSS didesain untuk digunakan dengan HTML dan ada tiga cara berbeda di dalam
menggunakan CSS dengan HTML yaitu inline CSS, internal CSS dan external CSS.
Tergantung keperluan. Berikut ini adalah penjelasan singkat untuk masing-masing
cara menggunakan CSS dengan HTML:
1. Inline CSS.
Inline CSS digunakan untuk memberi style (gaya) pada tag atau elemen HTML
tertentu. Anda dapat menggunakan atribut style untuk memberi style pada tag
HTML. Style hanya berlaku untuk tag HTML tersebut. Style di inline CSS memiliki
prioritas utama dan yang akan digunakan (rendering) meskipun tag HTML tersebut
juga sudah diberi style melalui internal CSS atau external CSS.
Berikut ini adalah contoh kode sederhana :
2. Internal CSS.
Internal CSS digunakan untuk memberi style yang hanya berlaku pada satu
laman web. Style yang diberikan diapit oleh tag <style> </style>
dan diletakkan di bagian elemen head atau tag <head> dari laman web. Anda
dapat menggunakan internal CSS bila pemberian style dimaksudkan hanya untuk satu
laman web saja dan tidak untuk digunakan di laman web yang lain. Anda dapat
menggunakan internal CSS bila kode untuk style tidak terlalu besar atau
kompleks.
Berikut ini adalah contoh kode sederhana :
3. External CSS.
External CSS adalah file berekstensi .css yang hanya berisi kode-kode
style. Tujuan menggunakan external CSS adalah untuk memisahkan kode style
dengan struktur dan tipe konten laman web. External CSS dapat diaplikasikan
pada lebih dari satu laman web sehingga semua laman web akan memiliki tampilan
atau desain yang seragam.
Sebagai contoh, buat file CSS bernama awal.css menggunakan text editor seperti Notepad atau Notepad++. Tuliskan kode CSS di bawah ini sebagai style yang akan diberlakukan di laman web. Simpan file CSS di folder yang sama tempat menyimpan file HTML.
Buat file HTML dan di bagian tag <head> tambahkan elemen link atau
tag <link>. Tag <link> ini akan digunakan untuk mengacu ke file CSS
yang dibuat sebelumnya. Perhatikan penulisan <link> beserta atributnya
untuk mengacu ke file CSS.
Berikut ini adalah contoh kode sederhana :
demikian contoh singkat yang saya dapat berikan dan kiranya dapat dimengerti cara penggunaannya.
0 Komentar