Komponen CSS
KOMPONEN CSS
Secara sekilas, setiap properti yang telah kita pelajari bahwa memberiakan nilai yang berbeda-beda pada setiap properti yang ada.
Nilai-nilai yang sering muncul pada properti-properti diatas adalah:
Nilai-nilai yang sering muncul pada properti-properti diatas adalah:
- length
- percentage
- color
- URL
- keyword
- shape
Setiap properti yang diberikan akan mampu mengambil nilai-nilai diatas sesuai dengan jenis properti-nya.Kadang, properti-properti tersebut tidak selalu dapat mengambil setiap jenis nilai yang diberikan nilai-nilai diatas, contohnya tidak semua properti dapat mengambil nilai yang negatif sama seperti properti tersebut mengambil nilai positif.
Catat bahwa semua properti juga bisa mengambil yang inherit (dapat mewariskan nilai pada elemen turunnya). Ada beberapa niali yang 'memaksa' sebuah elemen yang terpilih untuk mewariskan nilai dari elemen induknya, meskipun biasanya properti tersebut tidak melakukan pewarisan atau mewarisi sebuah nilai kepada elemen lain.
Nilai Panjang
Nilai panjang ini dapat berupa nilai positif atau negatif, mempunyai nilai bilangan dan harus diikuti dengan unit ukuran panjang.Catat bahwa nilai panjang ini dapat berupa nilai positif atau negatif, sedangkan beberapa properti yang telah kita pelajari diatas tidak dapat menerima ukuran nilai panjang yang negatif.
Terdapat dua buah jenis dasar dari sebuah nilai panjang yaitu relatif dan absolut.Nilai panjang absolut sebaiknya hanya digunakan ketika kita telah mengetahuiukuran dari sebuah output halaman web tersebut. Karena disini absolut lebih bersifat statik sehingga jika ada perubahan pada resolusi atau pixel, maka dapat merusak keseluruhan halaman web.
Sebaiknya anda menggunakan nilai panjang relatif, sehingga halaman web dapat ditampilkan dalam berbagai medium prantara output ketempat halaman web tersebut nanti akan ditampilkan meskipun resolusi maupun ukuran pixel dari outputnya berbeda-beda.
Beberapa unit pengukuran panjang dapat dilihat pada tabel berikut:
Dengan mempelajari setiap ukuran panjang ini, kita akan mengetahui apa kekurangan dan kelebihan dari masing-masing ukuran panjang ini.
Nilai Presentase
Selain menggunakan pengukuran banyak properti bisa juga mengambil nilai presentase.Anda dapat meningat bahwa sebuah elemen berada di dalam sebuah elemen induk(sebagai contoh sebuah<paragaf>akan berada di dalam <body>).Biasanya nilai presentase menentukan nilai presentase dari elemen induknya.
Sebagai contohnya, menentukan lebar properti dengan menggunakan nilai presentase berarti lebar sebuah elemen akan tergantung dengan persentase yang diberikan kepada elemen itu yang akan mempengaruhi elemen induk dari elemen itu. Singkatnya seperti berikut:
p {widht:75%}
Kode diatas berarti elemen paragraf akan berukuran 75% lebar dari elemen induknya, biasanya elemen body.Nilai presentase sangat penting dalam memposisikan sebuah elemen, jika seorang user memperbesar atau memperkecil browser window mereka, maka ukuran lama tetap akan bertahan tanpa perubahan pada tampilan desingnya .
Bentuk dari nilai presentase ini adalah positif dan tanda negatif (tidak ada tanda berarti positif)diikuti dengan bilangan di belakangnya, selanjutnya diikuti dengan simbol persen (%)Sebagai contohnya, -25%,+15% atau 15%.
Nilai Warna (Properti Color)
Nilai properti color ada tiga jenis diantaranya:
- Nama warna
- Warna dengan kode hexadecimal
- Warna RGB
Salah satu yang tidak bisa yaitu niali bentuk.Ini biasanya hanya digunakan pada properti clip,diperlukan sebagai bagian dari CSS2 yang mendefinisikansebuah bentuk. Sekarang terdapat bentuk persegi (rectangular) yang sederhana.
Bentuk dari persegi ini adalah:
rect (top left bottom right)
Setiap bagian atas, bawah, kiri dan kanan bisa berupa nilai panjang atau menggunakan kata kunci auto.Auto berarti setidaknya pada cliping context, nilai dari posisi properti ini sama dengan elemen itu sendiri.
Nilai ini akan didefinisikan ulang karena ini tidak mengikuti model CSS yang sama dengan CSS1, dimana posisi didefinisikan dengan menmasukan nilai sudut atas dan kiri halaman dengan dan tinggi.
Nah sobat koding , cukup sekian pengenalan CSS dari kami , artikel berikutnya akan membahas tentang Tutorial Membuat Menu Navigasi dinamis dengan CSS . Stay Tune ... XD
Atau Kalian Bisa download e-book CSSnya disini -> DOWNLOAD (MediaFire)
Nah sobat koding , cukup sekian pengenalan CSS dari kami , artikel berikutnya akan membahas tentang Tutorial Membuat Menu Navigasi dinamis dengan CSS . Stay Tune ... XD
Atau Kalian Bisa download e-book CSSnya disini -> DOWNLOAD (MediaFire)
Nb : Jangan lupa kasih komentar di bawah ..:D
No Comment to " Komponen CSS "