CSS’ Tags
Posted on May 2, 2008 by izmantoko
Background
|
Property |
Deskripsi |
Values |
| background | Mengeset semua properti background dalam satu deklarasi | background-color background-image background-repeat background-attachment background-position |
| background-attachment | Mengeset kondisi posisi background; antara dapat discroll atau tidak dapat digerakkan dalam halaman | scroll fixed |
| background-color | Mengeset warna latar background suatu elemen | color-rgb color-hex color-name transparent |
| background-image | Mengeset sebuah gambar menjadi sebuah background | url(URL) none |
| background-position | Mengeset posisi background | top left top center top right center left center center center right bottom left bottom center bottom right x% y% xpos ypos |
| background-repeat | Mengeset apakah/bagaimana background akan diulang | repeat repeat-x repeat-y no-repeat |
Border
|
Property |
Deskripsi |
Values |
| border | Mengeset semua properti untuk 4-border (yang tertutup) dalam satu deklarasi | border-width border-style border-color |
| border-bottom | Mengeset semua properti untuk bottom-border (yang bawah aja) dalam satu deklarasi | border-bottom-width border-style border-color |
| border-bottom-color | Mengeset warna dari bottom-border | border-color |
| border-bottom-style | Mengeset style dari bottom border | border-style |
| border-bottom-width | Mengeset ketebalan dari garis bottom-border | thin medium thick length |
| border-color | Mengeset warna dari keseluruhan border | color |
| border-left | Mengeset semua properti untuk left-border (yang kiri aja) dalam satu deklarasi | border-left-width border-style border-color |
| border-left-color | Mengeset warna dari left-border | border-color |
| border-left-style | Mengeset style dari left-border | border-style |
| border-left-width | Mengeset ketebalan dari garis left-border | thin medium thick length |
| border-right | Mengeset semua properti untuk right-border (yang kanan aja) dalam satu deklarasi | border-right-width border-style border-color |
| border-right-color | Mengeset warna dari right-border | border-color |
| border-right-style | Mengeset style dari right-border | border-style |
| border-right-width | Mengeset ketebalan dari garis right-border | thin medium thick length |
| border-style | Mengeset style dari keseluruhan border | none hidden dotted dashed solid double groove ridge inset outset |
| border-top | Mengeset semua properti untuk top-border (yang atas aja) dalam satu deklarasi | border-top-width border-style border-color |
| border-top-color | Mengeset warna dari top-border | border-color |
| border-top-style | Mengeset style dari top-border | border-style |
| border-top-width | Mengeset ketebalan dari garis top-border | thin medium thick length |
| border-width | Mengeset ketebalan dari keseluruhan border; terdapat empat jenis ketebalan | thin medium thick length |
Classification
|
Property |
Deskripsi |
Values |
| clear | Mengeset sisi dari sebuah elemen dimana elemen ngambang lainnya tidak diperbolehkan | left right both none |
| cursor | Menspesifikasi kursor yang ditampilkan | url auto crosshair default pointer move e-resize ne-resize nw-resize n-resize se-resize sw-resize s-resize w-resize text wait help |
| display | Mengeset apakah/bagaimana suatu elemen ditampilkan | none inline block list-item run-in compact marker table inline-table table-row-group table-header-group table-footer-group table-row table-column-group table-column table-cell table-caption |
| float | Mengeset dimana sebuah gambar atau teks dimunculkan pada elemen lain | left right none |
| position | Mengeset penempatan elemen sebagai posisi yang static, relative, absolute atau fixed | static relative absolute fixed |
| visibility | Mengeset apakah suatu elemen ditampilkan atau tidak | visible hidden collapse |
Dimension
|
Property |
Deskripsi |
Values |
| height | Mengeset tinggi dari sebuah elemen | auto length % |
| line-height | Mengeset jarak antar garis pada elemen | normal number length % |
| max-height | Mengeset tinggi maksimal dari elemen | none length % |
| max-width | Mengeset lebar maksimal dari elemen | none length % |
| min-height | Mengeset tinggi minimal dari elemen | length % |
| min-width | Mengeset lebar minimal dari elemen | length % |
| width | Mengeset lebar dari suatu elemen | auto % length |
Font
|
Property |
Deskripsi |
Values |
| font | Mengeset semua properti untuk font(huruf) dalam satu deklarasi | font-style font-variant font-weight font-size/line-height font-family caption icon menu message-box small-caption status-bar |
| font-family | Prioritas list untuk font family dan/atau generic pada suatu elemen | family-name generic-family |
| font-size | Mengset ukuran dari font | xx-small x-small small medium large x-large xx-large smaller larger length % |
| font-size-adjust | Menspesifikasi aspek nilai untuk sebuah elemen yang akan mempertahankan tinggi-x dari font pilihan pertama | none number |
| font-stretch | Memadatakan atau melonggarkan font-family yang digunakan | normal wider narrower ultra-condensed extra-condensed condensed semi-condensed semi-expanded expanded extra-expanded ultra-expanded |
| font-style | Mengeset style dari font | normal italic oblique |
| font-variant | Menampilkan teks dalam small-caps font atau normal font | normal small-caps |
| font-weight | Mengeset ketebalan huruf | normal bold bolder lighter 100 200 300 400 500 600 700 800 900 |
Generated Content
|
Property |
Deskripsi |
Values |
| content | Membuat konten dalam dokumen. Digunakan bersama pseudo-element :before dan :after | string url counter(name) counter(name, list-style-type) counters(name, string) counters(name, string, list-style-type) attr(X) open-quote close-quote no-open-quote no-close-quote |
| counter-increment | Mengeset berapa banyak suatu counter menambahkan pada tiap aksi pada selektor | none identifier number |
| counter-reset | Mengeset nilai yang counter set pada tiap aksi pada selektor | none identifier number |
| quotes | Mengeset tipe dari quote | none string string |
List and Marker
|
Property |
Deskripsi |
Values |
| list-style | Mengeset semua properti untuk sebuah list dalam satu deklarasi | list-style-type list-style-position list-style-image |
| list-style-image | Mengeset gambar sebagai list-item marker | none url |
| list-style-position | Mengeset dimana list-item marker ditempatkan pada list | inside outside |
| list-style-type | Mengeset tipe dari list-item marker | none disc circle square decimal decimal-leading-zero lower-roman upper-roman lower-alpha upper-alpha lower-greek lower-latin upper-latin hebrew armenian georgian cjk-ideographic hiragana katakana hiragana-iroha katakana-iroha |
| marker-offset | auto length |
Margin
|
Property |
Deskripsi |
Values |
| margin | Mengeset semua properti untuk margin dalam satu deklarasi | margin-top margin-right margin-bottom margin-left |
| margin-bottom | Mengeset batasan bawah dari elemen | auto length % |
| margin-left | Mengeset batasan kiri dari elemen | auto length % |
| margin-right | Mengeset batasan kanan dari elemen | auto length % |
| margin-top | Mengeset batasan atas dari elemen | auto length % |
Outlines
|
Property |
Deskripsi |
Values |
| outline | Mengeset semua properti untuk outline dalam satu deklarasi | outline-color outline-style outline-width |
| outline-color | Mengeset warna dari outline elemen | color invert |
| outline-style | Mengeset style outline dari elemen | none dotted dashed solid double groove ridge inset outset |
| outline-width | Mengeset ketebalan outline dari elemen | thin medium thick length |
Padding
|
Property |
Deskripsi |
Values |
| padding | Mengeset semua properti untuk padding (bloknot) dalam satu deklarasi |
padding-top padding-right padding-bottom padding-left |
| padding-bottom | Mengeset pad bagian bawah dari elemen | length % |
| padding-left | Mengeset pad bagian kiri dari elemen | length % |
| padding-right | Mengeset pad bagian kanan dari elemen | length % |
| padding-top | Mengeset pad bagian atas dari elemen | length % |
Positioning
|
Property |
Deskripsi |
Values |
| bottom | mengeset sejauh mana pojok bawah elemen di atas atau di bawah dari pojok bawah parent element | auto % length |
| clip | Mengeset bentuk dari elemen. Elemen diclip menjadi bentuk ini, dan ditampilkan | shape auto |
| left | Mengeset sejauh mana pojok kiri dari elemen di kiri/kanan tepi kiri parent element | auto % length |
| overflow | Mengeset apa yang terjadi jika konten dari elemen melebihi area elemen | visible hidden scroll auto |
| position | Menempatkan elemen dengan posisi static, relative, absolute, atau fixed | static relative absolute fixed |
| right | Mengeset sejauh mana pojok kanan dari elemen di kiri/kanan dari pojok kanan parent element | auto % length |
| top | Sets how far the top edge of an element is above/below the top edge of the parent element | auto % length |
| vertical-align | Sets the vertical alignment of an element | baseline sub super top text-top middle bottom text-bottom length % |
| z-index | Sets the stack order of an element | auto number |
Table
|
Property |
Deskripsi |
Values |
| border-collapse | Mengeset apakah border tabel collapse pada satu border atau terpisah sesuai standar HTML | collapse separate |
| border-spacing | Mengeset jarak yang memisahkan border sel (khusus untuk model separate-border) | length length |
| caption-side | Mengeset posisi dari judul tabel | top bottom left right |
| empty-cells | Megeset apakah sel kosong ditampilkan pada tabel atau tidak (khusus untuk model separate-border) | show hide |
| table-layout | Mengeset algoritma yang digunakan untuk menampilkan sel tabel, baris, dan kolom | auto fixed |
Text
|
Property |
Deskripsi |
Values |
| color | Mengeset warna teks | color |
| direction | Mengeset arah teks | ltr rtl |
| line-height | Mengeset jarak antar garis | normal number length % |
| letter-spacing | Menambah atau mengurangi jarak antar karakter | normal length |
| text-align | Mengatur teks agar rata kanan, kiri, tengah, atau kanan-kiri pada elemen | left right center justify |
| text-decoration | Menambah dekorasi pada teks | none underline overline line-through blink |
| text-indent | Mengindentasikan baris pertama teks pada elemen | length % |
| text-shadow | none color length |
|
| text-transform | Mengontrol huruf pada elemen | none capitalize uppercase lowercase |
| unicode-bidi | normal embed bidi-override |
|
| white-space | Mengeset bagaimana ruang putih di dalam elemen ditangani | normal pre nowrap |
| word-spacing | Menambah atau mengurangi jarak antar kata | normal length |
Pseudo-classes
|
Pseudo-class |
Kegunaan |
| :active | Menambahkan spesial style kepada elemen yang aktif |
| :focus | Menambahkan spesial style kepada elemen selama elemen sedang fokus |
| :hover | Menambahkan spesial style kepada elemen saat cursor berada di atas elemen tersebut |
| :link | Menambahkan spesial elemen kepada link yang belum kena hit |
| :visited | Menambahkan spesial style kepada link yang telah dihit |
| :first-child | Menambah spesial style pada elemen yang merupakan child pertama dari gabungan beberapa elemen lainnya |
| :lang | Membolehkan pemilik(author) untuk menentukan bahasa yang digunakan pada elemen tertentu |
Pseudo-elements
|
Pseudo-element |
Kegunaan |
| :first-letter | Menambahkan style spesial pada huruf pertama sebuah teks |
| :first-line | Menambah spesial style pada baris pertama sebuah teks |
| :before | Menyisipkan suatu konten sebelum elemen |
| :after | Menyisipkan suatu konten setelah elemen |
dari berbagai sumber
Filed under: ARC

