CSS merupakan hal pokok yang harus teman – teman pelajari, karena dengan CSS teman – teman bisa membuat tampilan website teman- teman menjadi lebih menarik dan dengan CSS teman – teman bisa membuat efek – efek tertentu dalam website
Internal Style Sheet merupakan cara meletakan script CSS diantara tag <head> dan </head>. Jadi Internal Style Sheet merupakan penggabungan file CSS dan HTML. Penulisan file CSS di HTML harus diawali tag <style> dan diakhiri dengan tag </style>. Namun internal style sheet tidak diperuntukkan untuk css yang isi filenya banyak, internal style sheet hanya diperuntukan file CSS yang sedikit. Baiklah saya akan mencontohkan penulisan Internal Style Sheet,
- Buka text editor masing – masing kemudian tulis kode berikut ;
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<!DOCTYPE html> <html> <head> <title>Belajar CSS</title> <style type="text/css"> body{font-family: sans-serif;} h2{ color: blue; font-style: italic; font-size: 20px; } p{ color: red; font-size: 12px; } </style> </head> <body> <h2> ini judul</h2> <h3> ini judul</h3> <p> ini contoh paragraf dengan color merah</p> <p> ini contoh paragraf dengan color merah</p> <p> ini contoh paragraf dengan color merah</p> </body> </html> |
2. Jika sudah simpan ke dalam html kemudian buka browser teman – teman.
3. Dan lihat gambar diatas jika teman – teman sudah benar menuliskan kodenya, maka hasilnya akan seperti gambar diatas. Jika teman – teman masih bingung di sini saya akan buatkan 1         contoh lagi.
4. Sama seperti diatas tuliskan kode berikut pada text editor teman – teman.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<!DOCTYPE html> <html> <head> <title>Belajar CSS</title> <style type="text/css"> h3{ color: red; font-style: italic; font-size: 20px; } p{ color: blue; font-size: 12px; text-align: center; } </style> </head> <body> <h2> ini judul</h2> <h3> ini judul</h3> <p> ini contoh paragraf dengan color merah</p> <p> ini contoh paragraf dengan color merah</p> </body> </html> |
5. Simpan kembali dengan nama bebas dengan format .html, lalu buka dalam browser maka hasilnya akan seperti gambar dibawah jika teman – teman sudah benar menuliskan kodenya.
Oke itulah artikel saya tentangInternal Style Sheet semoga dapat bermanfaat bagi teman – teman semua.