Konsep Dasar CSS
Bagaimana Menulis CSS?
Dalam hal ini ada beberapa istilah dan kosep dasar dari css. Tapi sebelum menuju pembahasan lebih lanjut, akan lebih baik kita harus membiasakan dengan bagaimana suatu style harus ditulis. Berikut adalah contoh mudah penulisan css pada suatu halaman web:
<html> <head> <style Type="text/css"> h1{font-family:tahoma} h2{color: blue} p{font-size:11pt ; font-style: italic} </style> </head> <body> <h2>NuSinau</h2> <p>NuSinau adalah suatu website tempat berbagi berbagai ilmu pengetahuan. </p></body> </html>
selector (properti: nilai)
body (color: blue)
p {font-family: tahoma}
h1 {font-weight: bold}
dan lain-lainSelector biasanya merupakan elemen HTML atau tag dimana berbagai properti diberi suatu nilai. Dalam sebuah selector, setiap properti mempunyai nilai masing-masing dan sejumlah properti dengan nilai-nilai terkait dapat diatur.
Seperti pada contoh diatas; body, p, dan h1 adalah suatu selector dimana warna (color), nama font (font-family) dan jenis font (font-weight) diberi nilai untuk tiap propertinya (tahoma, bold, blue, dll).
h1 (font-size: 20px; text-align: left; color: blue; font-family: Arial;)
dapat pula ditulis seperti:
h1 (font-size: 20px; text-align: left; color: blue; font-family: Arial;)
Pengelompokan Selector (Grouping of Selectors)
Seperti dapat dilihat, satu selector dapat memiliki beberapa properti. Dalam konteks yang berbeda, beberapa selector dapat mempunyai properti dengan nilai yang sama. Dengan begitu harus dilakukan pengolompokan selector.
h1 , body , p , ul { color : blue; }
Pada contoh diatas, elemen header, body, paragraph, unordered list berada pada group yang sama. Semua elemen tersebut nantinya akan berwarna biru.
Mengapa Pengelompokan diperlukan dalam CSS?
- Untuk berbagi style yang sama, bila beberapa elemen mempunyai nilai properti yang sama (misalnya font, ukuran, warna, dll).
- Dengan satu perintah dapat memberikan properti style pada elemen yang berbeda dengan nilai yang sama.
- Untuk menghemat waktu bila terjadi penambahan properti dan juga ketika merubah properti di elemen.
Kata Kunci
Sintak CSS, konsep html, konsep dasar css, landasan teori css, prinsip dasar css, contoh css, konsep dasar xml, dasar css, soal dan jawaban konsep dasar css, contoh head pada html.
Related posts:
Iya.tulisanya berguna buat saya.terima kasih^^
senang bisa membantu… :)
bro, ada gak caranya mengupload web yang sudah jadi ke dunia maya. ketika web yang saya sederhananya sudah jadi. Kira2 yang gratis utk sementara, biar mengetahui hasilnya. dan bagaimana jika data basenya tidak usah ikut diupload, sehingga di atas (satelit) hanya program dasarnya aja, tapi databasenya ada di laptop yang. Takutnya kalau diatas Pentagon Tau Data2 yang kita inputkan. Itu caranya gimana bro, :) aq udah makai CSS dan HTML. Tlong balasannya (msandi808@gmail.com)
upload aja ke server saya… :p
tak kasih subdomain buat ngetes… boleh lhoo…
upload programnya ke server, database arahkan ke laptop mas andi dengan ip static-nya.. selesai mas.
kok sampe pentagon?….. wah hebat kali ms andi infomasinya… :)