- External Style Sheet
- Internal Style Sheet
- Inline Style Sheet
Dari ketiga cara di atas, kita bisa memanfaatkan sesuai kebutuhan. Pada kesempatan kali ini, kita akan membahas tentang Inline Style Sheet. Inline Style Sheet cocok kita manfaatkan, jika kita hanya ingin mengubah tampilan tag html tertentu saja. Sebagai contoh : Jika dalam satu halaman ada 4 paragraf dan paragraf ke-2 sebagai paragraf terpenting ingin di format dengan tampilan yang berbeda, maka Inline Style Sheet ini bisa kita manfaatkan.
Dengan cara ini, kita langsung memasukkan atribut style pada tag html. Atribut style inilah yang nanti berisi properti-properti dari CSS. Dari contoh di atas kita akan coba merubah tampilan pada paragraf ke-2. Berarti tag html <p> pada paragraf ke-2 kita masukkan atribut style dan property-property CSS yang sesuai dengan tampilan yang kita inginkan.
<p>Ini Paragraf Pertama</p>
<p style="color:blue; font-weight:bold; font-style:italic;">Paragraf kedua ini kita rubah tampilannya, supaya tampil beda.</p>
<p>Ini Paragraf ketiga</p>
<p>Ini Paragraf keempat</p>
Kita perhatikan, penulisan atribut tetap sesuai aturan pada html yaitu menggunakan tanda sama dengan dan tanda petik tetap ada. Sedangkan properti CSS nya juga sesuai aturan dalam penulisan CSS yang telah kita bahas pada Pengenalan CSS. Pada contoh di atas kita coba merubah warna huruf, ketebalan huruf dan style hurufnya kita buat miring. Tentunya teman-teman bisa menambahkan properti-properti CSS yang lain sesuai kebutuhan. Coba kita lihat hasilnya.
Ini Paragraf Pertama
Paragraf kedua ini kita rubah tampilannya, supaya tampil beda.
Ini Paragraf ketiga
Ini Paragraf keempat
Lihat juga pada pembahasan selanjutnya kita akan membahas metode yang kedua yaitu Internal Style Sheet CSS
Advertisement :| Belajar Membuat Website | Penjualan Pulsa |
| 4 Langkah mudah membuat website untuk pemula. Ayo gabung !!! | Bisnis penjualan pulsa murah yang menguntungkan,sambil bersedekah |
Tidak ada komentar:
Posting Komentar
Harap berkomentar dengan kata kata yang baik dan sopan ya..:)