Tag2 CSS

Buat kalian yang pengen nyoba bikin website dengan menggunakan css buat pemanis (en karena beberapa tag juga udah dilarang, sekarang kita harus pake css)

Sumber lengkapnya bisa dilihat disini

Harap jangan pencet more kalo g mau mabok…

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

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s