Cascading Style Sheet (CSS) merupakan salah satu bahasa pemrograman web untuk
mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih
terstruktur dan seragam. Pada umumnya CSS dipakai untuk memformat
tampilan halaman web yang dibuat dengan bahasa HTML dan XHMTL. CSS dapat
mengendalikan ukuran gambar, warna bagian
tubuh pada teks, warna tabel, ukuran border,
warna border, warna hyperlink, warna mauseover, spasi antar
paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter
lainnya. CSS adalah bahasa style sheet yang digunakan untuk mengatur tampilan dokumen.
Dengan adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan
format yang berbeda.
- · Internal CSS: css ini ditulis dibagian <head> html dengan menggunakan tag <style>, atribut-atribut css tersebut dideklarasikan di dalam atribut tersebut: berikut ini contohnya
- · Eksternal CSS: css ini dibuat pada file terpisah dari htmlnya dan disimpan menggunakan format .css
- · Inline CSS: css ini dideklarasikan di dalam tag html sebagai atribut, ketika dideklarasikan harus menggunakan atribut “style” dan elemen-elemen css didekalarasikan di dalam atribut tersebut
No
|
Properti
|
Deklarasi
|
Deskripsi Properti
|
1
|
Background-color
|
Background-color:#FF0000;
|
Berguna untuk mengganti warna background
|
2
|
Background-origin
|
Background-origin:border-box;
|
Menentukan area untuk background gambar
|
3
|
Text-align
|
Text-align:left;
|
Berguna untuk mengatur perataan tulisan
|
4
|
Font-size
|
Font-size:100px;
|
Berguna untuk mengatur ukuran font pada web
|
5
|
Border-style
|
Border-style:dotted;
|
Menentukan mode garis tepi yang digunakan untuk
semua border
|
6
|
Border-color
|
Border-color:#000000;
|
Menentukan warna garis tepi
|
7
|
Font-family
|
Font-family:”Times New
Roman”, Times, serif;
|
Berguna untuk mengganti tipe font yang di inginkan
|
8
|
Position
|
Position:absolute;
|
Berguna untuk mengatur posisi elemen suatu web
|
9
|
Border-radius
|
Border-radius:2em;
|
Menentukan radius semua garis
|
10
|
a:link
|
a:link {color:# FF0000;}
|
Menentukan warna link normal
|
11
|
a:hover
|
a:hover{color:# FF0000;}
|
Menentukan warna link ketika ada mouse diatasnya
|
12
|
Border-width
|
Border-width:10px;
|
Untuk mengatur lebar garis tepi
|
13
|
Text-decotration
|
Text-decotration:none;
|
Berguna untuk mengatur dekorasi tampilan text, Biasanya
digunakan untuk tampilan sebuah link
|
14
|
Text-transform
|
Text-transform:uppercase;
|
Berfungsi untuk mengubah jenis tulisan menjadi huruf besar semua(uppercase),
huruf semua kecil(lowercase), atau huruf besar di awal
|
15
|
List-style-type
|
List-style-type:square;
|
Menentukan bentuk tipe numbering
|
16
|
Border-collapse
|
Border-collapse: collapse;
|
Menentukan apakah garis tepi table menjadi 1 garis atau terpisah
|
17
|
Display
|
Display:none;
|
Menghilangkan elemen tetapi tidak mengambil space di
halaman we
|
18
|
Background-repeat
|
Background-repeat:norepeat;
|
Menentukan background apakah berulang atau tidak
|
19
|
Caption-side
|
Caption-side:bottom;
|
Menentukan posisi caption pada table
|
20
|
Opacity
|
Opacity:0.5;
|
Berguna untuk mengatur transparasi gambar pada web
|
Tidak ada komentar:
Posting Komentar