CSS adalah singkatan dari Cascading Style Sheets CSS (Cascading Style Sheet) digunakan untuk melengkapi file HTML, dan tugas utamanya adalah menetapkan aturan tampilan/style yang akan digunakan pada sebuah website. Dapat digunakan untuk
Merubah ukuran font Merubah warna background Mengatur perataan paragraf dll
Menambahkan CSS ke dalam HTML 1.
External Style Sheets External style sheets merupakan dokumen css yang disimpan dalam file berbeda dengan file HTML. File ini berekstension .css Untuk menyertakan file css, letakkan tag berikut ke dalam … Biasa dipakai jika beberapa halaman akan menggunakan style yang sama.
Menambahkan CSS ke dalam HTML 2.
Internal Style Sheets diletakkan di antara … <style type=“text/css”> letakkan css di sini
3.
Inline Style diletakkan di dalam elemen HTML
Istilah Dalam CSS Style rule Cascading style sheet merupakan kumpulan aturan yang mendefinisikan style dari document. Sebagai contoh kita bisa membuat aturan style yang menentukan bahwa semua
Style sheets terdiri dari dua bagian: 1. Selector Bagian pertama sebelum tanda “{}” disebut selector 2. Declaration Terdiri dari property dan value Antara property yang satu dan yang lainnya dipisahkan dengan tanda ; (titik koma)
Komentar pada CSS Komentar biasa digunakan untuk memberi keterangan pada css yang dibuat. Komentar tidak akan ditampilkan pada browser Komentar dalam CSS dibuat dengan /* tulis komentar di sini */
Class Selector
Class selector
Diawali dengan tanda titik (.) dan diikuti nama class .namakelas {….} Digunakan agar sebuah objek bisa menggunakan deklarasi CSS tersebut Misalnya
…
Artinya paragraf tersebut menggunakan aturan yang ditetapkan dalam class selector judul
ID Selector
Class selector
Diawali dengan tanda titik (#) dan diikuti nama id #namaid {….} Digunakan agar sebuah objek bisa menggunakan deklarasi CSS tersebut dan biasanya bersifat unik dalam sebuah halaman Misalnya
…
Artinya paragraf tersebut menggunakan aturan yang ditetapkan dalam id selector header
CSS Background Properties (1) CSS background properties digunakan untuk mengatur tampilan background pada sebuah elemen. Misalnya menentukan warna background, membuat background berupa gambar, dan menentukan posisi background. Property
Description
Values
background
Property yang digunakan untuk menyeting semua backgroung property dalam sebuah deklarasi saja.
Menentukan apakah background gambar fixed atau scroll
scroll fixed
background-color
Menentukan warna background
color-rgb color-hex color-name transparent
CSS Background Properties (2) background-image
menentukan gambar sebagai background
url none
background-position
Menentukan posisi awal background yang berupa gambar
top left top center top right center left center center center right bottom left bottom center bottom right x-% y-% x-pos y-pos
background-repeat
Menentukan bagaimana background yang berupa gambar akan ditampilkan secara berulang
repeat repeat-x repeat-y no-repeat
CSS Text Properties (1) CSS Text properties digunakan untuk mengatur tampilan text. Misalnya menentukan warna text, perataan text dan dekorasi text. Property
Description
Values
color
Menentukan warna text
color
letter-spacing
Menentukan jarak spasi antar huruf
normal length unit
text-align
Perataan text dalam sebuah element
left right center justify
text-decoration
Menambahkan dekorasi ke dalam text none underline overline line-through blink
CSS Text Properties (2) text-indent
Memberikan indent pada baris pertama
length %
text-transform
Menentukan bentuk huruf
none capitalize uppercase lowercase
white-space
Menentukan bagaimana white space akan ditangani
normal pre nowrap
word-spacing
Menentukan jarak spasi antar kata
normal length
CSS Font Properties (1) CSS font properties digunakan untuk mengtur tampilan huruf. Misalnya menentukan jenis huruf, ukuran huruf, ketebalan dan style huruf. Property
Description
Values
font
Sebuah property singkat untuk menyeting semua properti untuk font dalam sebuah deklarasi
xx-small x-small small medium large x-large xx-large smaller larger length %
font-style
Menentukan style huruf
normal italic oblique
font-weight
Menentukan ketebalan huruf
normal bold bolder lighter
CSS Border Properties (1) CSS border properties digunakan untuk mengatur border di setiap elemen. Misalnya saja warna border, ketebalan border dan style border. Property
Description
Values
border
Digunakan untuk menentukan property border(atas, kiri, kanan, bawah) dalam satu deklarasi saja
border-width border-style border-color
border-bottom
Digunakan untuk menentukan property border bagian bawah dalam satu deklarasi saja
border-bottom-width border-style border-color
border-bottom-color
Menentukan warna border bawah
border-color
border-bottom-style
Menentukan style border bawah
border-style
border-bottom-width
Menentukan lebar border bawah
thin medium thick length
CSS Border Properties (2) border-color
Menentukan warna keempat border
color
border-left
Digunakan untuk menentukan property border bagian kiri dalam satu deklarasi saja
border-left-width border-style border-color
border-left-color
Menentukan warna border kiri
border-color
border-left-style
Menentukan style border kiri
border-style
border-left-width
Menentukan lebar border kiri
thin medium thick length
border-right
Digunakan untuk menentukan property border bagian kanan dalam satu deklarasi saja