Ada tiga opsi dalam menentukan warna dengan menggunakan CSS :
1. Setting warna latar depan untuk isi,
2. Setting warna belakang untuk area,
3. Setting gambar latar belakang untuk digunakan dalam area tersebut.
1. Nilai Warna Common Name ; menggunakan warna dengan menggunakan nilai warna common name, yaitu dengan memasukkan warna yang diinginkan, contoh : { color:blue; background-color:lime; }
2. Nilai Warna Hexadecimal ; adalah sistem warna dengan basisi 16 angka. Angka hex diawali dengan karakter (#) dan dapat terdiri dari tiga atau enam digit angka. Contoh : { color:#00ffff; background-color:#00ccff; }
3. Nilai Warna RGB ; dengan menggunakan nilai warna RGB kita dapat menentukan warna dengan menggunakan nilai RGB dengan memasukkan nilai dari warna merah, hijau, dan biru (Red, Green, Blue), seperti contoh : {color:rgb(255,255,204); }
PROPERTY WARNA DAN LATAR BELAKANG
1. Warna ; warna dalam CSS dapat dibuat menggunakan property ”color” dan diikut dengan ”nilai atau nama warna”. Nilai warna untuk latar belakang tersebut dapat mengunakan nilai warna common name, nilai warna heksadesimal, dan nilai warna RGB.
2. Warna Latar atau warna background memiliki dua nilai, yaitu :
”transparent” untuk membuat warna latar menjadi transparan atau tidak terlihat, dan dengan menentukan warna yang diinginkan.
Background-color:transpernt
Background-color:lime
3. Gambar Latar ; untuk menempatkan gambar latar yang akan menjadi pemanis sebuah halaman web atau hanya untuk sebuah elemen tertentu saja.
Background-image:none
Background-image:url{
Background-image:url(picture1.jpg);
4. Latar Berulang ; karena meletakkan sebuah gambar dengan ukuran yang kecil maka dalam browser gamabr tersebut ditampilkan sesuai dengan ukuran gambar sebenarnya. Dalam CSS untuk mengontrol perulangan gambar yang dimaseukkan dengan menggunakn propoerty ”background-repeat”.
Property ”Background-repeat” : Nilai : ”repeat”, ”repeat-x”, ”repeat-y”, ”no-repeat”
a. Background-repeat:repeat ; yaitu membuat gambar yang dimasukkan menjadi berulang hingga keseluruhan halaman web tertutup seperti menentukan gambar biasa dalam dokumen HTML.
b. Background-repeat:repeat-x ; yaitu mengulang gambar yang diletakkan dalam dokumen web yang dibuat secara horizontal hingga memenuhi halaman web dan tidak mengulang secara vertical.
c. Background-repeat:repeat-y ; yaitu mengulang gambar yang diletakkan dalam dokumendibuat secara vertical hingga memenuhi halaman web dan tidak mengulang secara horizontal.
d. Background-repeat:no-repeat ; tidak akan mengulang gambar sama sekali
Background-repeat:repeat-y;
5. Attachment Layar ; untuk menentukan apakah sebuh gambar latar tidak akan ikut bergerak jika kita scroll mouse ke atas dan ke bawah dengan menggunakan property ”background-attachment”. Nilai property adalah ”scroll” jika anda inign agar gambar ikut bergerak ketika anda scroll mouse ke atas maupun ke bawah, ”fixed” jika anda ingin agar gambar tidak ikut bergerak ketiak anda scroll maouse.
Background-attachment:fixed;
6. Posisi Latar ; Posisi gambar dan latar belakang dalam CSS dapa diatur secara tepat dalam CSS dengan menggunakan property ”background-position” dengan Nilai property :
”
”
”top” yaitu menentukan posisi pada atas halaman web,
“center” yaitu dengan menentukan posisi pada tengah halaman web,
“bottom” yaitu dengan menentukan posisi pada halaman web,
“left” yaitu menentukan posisi gambar pada cébela kirin halaman web, dan
“right” yaitu dengan menentukan posisi pada cébela kanan halaman web.
Background-position: 75px 0px
Tidak ada komentar:
Posting Komentar