Jumat, 02 Mei 2008

Css Reference

Css Reference

Background

Properti 

Deskripsi  

Nilai 

background

Perintah untuk mengeset tampilan background seluruh dokumen 

background-color
background-image
background-repeat background-attachment background-position

background-attachment

Membuat background apakah tetap (fix) atau dapat fleksibel (scrollable) 

Fix (tetap)

Scroll (dapat digerakkan) 

background-color

Mengeset warna background 

color-rgb
color-hex
color-name
transparent

background-image

Membuat gambar sebagai background

URL

None (kosong) 

background-position

Mengeset posisi awal background

top left (atas kiri)
top center (Atas tengah)
top right (atas kanan)
center left (tengah kiri)
center center (tengah tengah)
center right (tengah kanan)
bottom left (bawah kiri)
bottom center (bawah tengah)
bottom right (bawah kanan)
x% y%
xpos ypos

background-repeat

Mengeset pengulangan pada gambar

Repeat (mengulang)

Repeat X (mendatar)

Repeat Y (vertikal)

No repeat (tanpa mengulang) 

Border

Properti 

Deskripsi  

Nilai 

border

Membuat border untuk seluruh doukumen , berjumlah 4 border

border-width (lebar)
border-style
(model)
border-color
(warna)

border-bottom

Membuat seluruh border bagian bawah dalam satu deklarasi

border-bottom-width(lebar)
border-style
(Model)
border-color
(warna)

border-bottom-color

Mengeset warna bottom- border

border-color (warna)

border-bottom-style

Mengeset model/bentuk bottom- border

border-style(Model)

border-bottom-width

Mengeset lebar bottom- border

border-bottom-width(lebar)

border-color

Mengeset warna ke-empat border , dapat dari satu warna ke empat warna

Color (warna)

border-left

Mengeset properti border bagian kiri dalam satu deklarasi

border-left-width(lebar)
border-style (
model)
border-color
(warna)

border-left-color

Mengeset warna border kiri

border-color(warna)

border-left-style

Mengeset model (bentuk) border kiri

border-style (model)

border-left-width

Mengeset lebar border kiri

Thin(tipis)
medium
(sedang)
thick
(tebal)
length
(panjang)

border-right

Mengeset properti border bagian kanan dalam satu deklarasi 

border-right-width(lebar)
border-style (
model)
border-color
(warna)

border-right-color

Mengeset warna border kanan

border-color(warna)

border-right-style

Mengeset model (bentuk) border kanan 

border-style (model)

border-right-width

Mengeset lebar border kanan

border-right-width(lebar)

border-style

Mengeset model dari semua border

None (tanpa modifikasi)
hidden (tersembunyi)
dotted (titik-titik)
dashed (garis putus2)
solid (garis tebal)
double(garis 2 X tebal)
groove
ridge
inset
outset

border-top

Mengeset border bagian atas

border-top-width(lebar)
border-style (
model)
border-color
(warna)

border-top-color

Mengeset warna border atas

border-color(warna)

border-top-style

Mengeset model (bentuk) border atas

border-style (model)

border-top-width

Mengeset model (bentuk) border atas

Thin(tipis)
medium (sedang)
thick (tebal)
length (panjang)

border-width

Mengeset lebar border keseluruhan

thin(tipis)
medium(sedang)
thick(tebal)
length(panjang)

Classification

Properti

Deskripsi

Nilai

clear

Mengeset bagian dari elemen dimana element floating tidak diperbolehkan

Left (kiri)
right(kanan)
both (keduanya)
none (tanpa format)

cursor

Spesifikasi dari kursor yang ingin ditampilkan

url (link)
auto (otomatis)
crosshair (pembidik)
default (standar)
pointer (pointer)
move (bergerak)
e-resize
ne-resize
nw-resize
n-resize
se-resize
sw-resize
s-resize
w-resize
text (teks)
wait(menunggu)
help(bantuan)

display

Menunjukkan bagaimana elemen ditampilkan

None (tanpa format)
inline (didalam garis)
block
list-item(daftar)
run-in
compact
marker
table(tabel)
inline-table
table-row-group
table-header-group
table-footer-group
table-row (baris tabel)
table-column-group
table-column (kolom tabel)
table-cell (cell)
table-caption (judul tabel)

float

Mengeset gambar atau teks muncul di elemen lain

Left (kiri)
right (kanan)
none (tanpa format)

position

Memposisikan elemen pada posisi statis, relatif, mutlak,tetap

Static (statis)
relative (relatif)
absolute (mutlak)
fixed (tetap)

visibility

Mengeset elemen apakah muncul atau tidak muncul

Visible (muncul)
hidden (tersembunyi)
collapse (kolaps)

Dimension

Properti 

Deskripsi 

Nilai 

height

Mengeset tinggi elemen

Auto (otomatis)
length (panjang)
%

line-height

Mengeset jarak antar elemen

Normal (normal)
number (nomer)
length (panjang)
%

max-height

Mengeset tinggi maksimal elemen

None (tanpa format)
length (panjang)
%

max-width

Mengeset lebar maksimal dari elemen

None (tanpa format)
length (panjang)
%

min-height

Megeset tinggi minimal dari elemen

Length (panjang)
%

min-width

Mengeset lebar minimal dari elemen

Length (panjang)
%

width

Mengeset leabr dari elemen

Auto (otomatis)
%
length
   (panjang)

Font

Properti 

Deskripsi 

Nilai 

font

Mengeset jenis font secara keseluruhan

font-style (model)
font-variant (varian)
font-weight (tebal)
font-size/line-height (besar)
font-family
caption (judul)
icon (ikon)
menu (menu)
message-box (kotak pesan)
small-caption (judul kecil)
status-bar (kotak status)

font-family

Prioritas dari daftar generik font family

family-name (nama)
generic-family (umum)

font-size

Mengeset ukuran font

None (tanpa format)
number (nomor)

font-size-adjust

Mengeset nilai element yang mewakili pilihan dari font

None (tanpa format)
number (nomor)

font-stretch

Memperlebarkan ukuran dari font

Normal (normal)
wider (lebar)
narrower (sempit)
ultra-condensed
extra-condensed
condensed
semi-condensed
semi-expanded (semi luas)
expanded (meluaskan)
extra-expanded (ekstra luas)
ultra-expanded (ultra luas)

font-style

Mengeset bentuk dari font

Normal
italic (miring)
oblique

font-variant

Mengeset font dengan normal atau huruf kecil

normal
small-caps

font-weight

Mengeset ketebalan dari font

normal
bold (tebal)
bolder (lebih tebal)
lighter (tipis)
100
200
300
400
500
600
700
800
900

Generated Content

Properti 

Deskripsi 

Nilai 

content

Membuat isi darwi dokumen

String
url
counter(name)
counter(name, list-style-type)
counters(name, string)
counters(name, string, list-style-type)
attr(X) (attribut)
open-quote
close-quote
no-open-quote
no-close-quote

counter-increment

Mengeset nilai dari counter menaik (incremen)

none
identifier number

counter-reset

Mengeset nilai dari counter kenilai awal

none
identifier number

quotes

Mengeset tipe dari tanda petik

none
string string

List and Marker

Properti 

Deskripsi 

Nilai 

list-style

Mengeset semua properties menjadi suatu daftar (list) dalam satu pendeklarasian

list-style-type
list-style-position
list-style-image

list-style-image

Mengeset gamabar sebagai gambar yang sudah ditandai

none
url

list-style-position

Memposisikan item yang sudah di tandai

Inside (didalam)
outside (diluar)

list-style-type

Mengeset tipe dari item yang sudah ditandai

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 (otomatis)
length (panjang)

Margin

Properti 

Deskripsi 

Nilai 

margin

Mengeset margin dari elemen

margin-top (atas)
margin-right (kanan)
margin-bottom (bawah)
margin-left (kiri)

margin-bottom

Mengeset margin bagian bawah

Auto (otomatis)
length (panjang)
%

margin-left

Mengeset margin bagian kiri

Auto (otomatis)
length (panjang)
%

margin-right

Mengeset margin bagian kanan

Auto (otomatis)
length (panjang)
%

margin-top

Mengeset margin bagian atas

Auto (otomatis)
length (panjang)
%

Outlines

Properti 

Deskripsi 

Nilai 

outline

Mengeset garis terluar dari semua elemen

outline-color
outline-style
outline-width

outline-color

Mengeset warna dari garis luar

Color (warna)
invert

outline-style

Mengeset model garis luar

None (tanpa format)
dotted (titik)
dashed (garis putus2)
solid (tebal)
double (dua kali)
groove
ridge
inset
outset

outline-width

Mengeset lebar garis luar

Thin (tipis)
medium (medium)
thick (tebal)
length (panjang)

Padding

Properti 

Deskripsi 

Nilai 

padding

Mengeset nilai padding

padding-top (atas)
padding-right (kanan)
padding-bottom (bawah)
padding-left (kiri)

padding-bottom

Mengeset padding bawah

length
%

padding-left

Mengeset padding kiri

length
%

padding-right

Mengeset padding kanan

length
%

padding-top

Mengeset padding atas

length
%

Positioning 

Properti 

Deskripsi 

Nilai 

bottom

Mengeset batas bawah dari suatu elemen

auto
%
length

clip

Mengeset bentuk dari elemen

shape
auto

left

Mengeset batas kiri elemen

auto
%
length

overflow

Mengeset area dari elemen overflow

visible
hidden
scroll
auto

position

Mengeset posisi dari suatu elemen apakah tetap, statis, relatif

static
relative
absolute
fixed

right

Mengeset batas kanan dari suatu elemen

auto
%
length

top

Mengeset batas atas dari suatu elemen

auto
%
length

vertical-align

Mengeset alignment tegak dari suatu elemen

baseline
sub
super
top
text-top
middle
bottom
text-bottom
length
%

z-index

Mengeset stack order dari suatu elemen

auto
number

Tabel

Properti 

Deskripsi 

Nilai 

border-collapse

Mengeset apakah tabel terbuka atau tidak

collapse
separate

border-spacing

Mengeset besar spasi antar border

length length

caption-side

Mengeset judul tabel

top
bottom
left
right

empty-cells

Mengset cell menjadi kosong

show
hide

table-layout

Mengeset tampilan tabel

auto
fixed

Text

Properti 

Deskripsi 

Nilai 

color

Mengeset warna teks

color

direction

Megeset arah teks

ltr
rtl

line-height

Mengeset tinggi garis

normal
number
length
%

letter-spacing

Mengeset spasi antar kalimat

normal
length

text-align

Mengeset margin teks

left
right
center
justify

text-decoration

Mengeset dekorasi teks

none
underline
overline
line-through
blink

text-indent

Meng-indent teks pertama pada elemen

length
%

text-shadow

 

none
color
length

text-transform

Mengontrol elemen teks

none
capitalize
uppercase
lowercase

unicode-bidi

 

normal
embed
bidi-override

white-space

Mengeset spasi "putih"

normal
pre
nowrap

word-spacing

Mengest besar kecilnya spasi

normal
length

Pseudo-classes

Properti 

Deskripsi 

Nilai 

:active

Menambahkan model spesial pada elemen

-

:focus

Menambahkan model spesial pada elemen (harus fokus)

-

:hover

Menambahkan model spesial pada elemen ketika mengarahkan mouse pada elemen tersebut

-

:link

Menambahkan model spesial pada elemen yang tidak dikunjungi

-

:visited

Menambahkan model spesial pada elemen yang dikunjungi

-

:first-child

Menambahkan model spesial pada elemen yang mempunyai

Sub (anak)

-

:lang

Mengeset bahasa

-

Pseudo-Element

Properti 

Deskripsi 

Nilai 

:first-letter

Menambahkan model spesial pada teks pertama elemen

-

:first-line

Menambahkan model spesial pada garis pertama elemen

-

:before

Menambahkan konten sebelum elemen

-

:after

Menambahkan konten sesudah elemen

-


 

HTML Reference

Tag

penjelasan

<!--...-->

Mendefinisikan komentar

<!DOCTYPE>

Mendefiniskan tipe dokumen

<a>

Membuat link ke dokumen lain

<abbr>

Mendefinisikan singkatan

<acronym>

Mendefinisikan akronim

<address>

Mendefinisikan alamat elemen

<applet>

<area>

Mendefinisikan area didalam map gambar

<b>

Membuat teks menjadi tebal

<base>

Mendefiniskan URL standar untuk seluruh halaman

<basefont>

Mendefinisikan font standar

<bdo>

Mendefinisikan arah dari teks

<big>

Membuat teks menjadi besar

<blockquote>

Mendefinisikan rumus yang panjang

<body>

Mendefinisikan element badan

<br>

Membuat pindah ke baris baru

<button>

Membuat tombol tekan

<caption>

Membuat judul tabel

<center>

Membuat teks menjadi di tengah

<cite>

<colgroup>

Mendefinisikan group dari kolom tabel

<dd>

Membuat definisi deskripsi

<del>

Mendeklarasikan teks yang di hapus

<dir>

Mendeklarasikan list direktori

<div>

Membuat daerah pada suatu dokumen

<dfn>

Membuat aturan definisi

<dl>

Membuat daftar definisi

<dt>

Membuat daftar aturan definisi

<em>

Membuat garis bawah pada teks

<fieldset>

Mengeset fieldset

<font>

Mendeklarasikan font, warna , dan ukuran teks

<form>

Membuat formulir

<frame>

Membuat sub-jendela

<frameset>

Mengeset frame (bingkai)

<h1> to <h6>

Mendefinisikan Header 1 s.d Header 6

<head>

Menginformasikan sesuatu tentang dokumen

<hr>

Membuat "ruler" horisontal

<html>

Membuat dokumen html

<i>

Membuat teks menjadi miring

<iframe>

Mendefinisikan teks didalam frame

<img>

Mendefiniskan gambar

<input>

Membuat lembar masukan

<ins>

Mendefiniskan teks yang dimasukkan

<kbd>

Mendefinsikan teks keyboard

<label>

Membuat label pada form

<legend>

Membuat judul di fieldset

<li>

Membuat daftar item

<menu>

Membuat daftar menu

<meta>

Membuat meta-informasi

<noframes>

Membuat bagian tanpa frame

<noscript>

Membuat suatu bagian tanpa skrip

<object>

Mendeklarasikan object yang ter-embed

<ol>

Membuat daftar permintaan

<optgroup>

Membuat grup pilihan

<option>

Membuat menu pilihan (drop down)

<p>

Mendefiniskan object sebagai paragraf

<param>

Membuat parameter sebuah object

<pre>

Membuat teks yang belum di format

<q>

Membuat rumus yang pendek

<s>

Membuat teks dengan strikethrough

<samp>

Mendefinisikan contoh kode dari komputer

<script>

Mendefinisikan variabel sebagai sebuah skrip

<select>

Membuat daftar yang bisa dipilih

<small>

Membuat teks menjadi kecil

<span>

Membuat suatu bagian pada dokumen

<strike>

Membuat teks dengan strikethrough

<strong>

Mendefiniskan teks menjadi "sangat"

<style>

Mendefiniskan model/bentuk definisi

<sub>

Membuat subscript teks

<sup>

Membuat superscript teks

<table>

Membuat tabel

<tbody>

Membuat badan tabel

<td>

Membuat cell pada tabel

<textarea>

Mendefiniskan area teks

<tfoot>

Mendefiniskan kaki tabel

<th>

Membuat kepala tabel

<thead>

Membuat kepala tabel

<title>

Membuat judul dokumen

<tr>

Membuat baris pada tabel

<tt>

Membuat teks dengan tipe "tele"

<u>

Membuat teks dengan garis bawah

<ul>

Membuat daftar yang tidak di inginkan

<var>

Mendefinisikan variabel

<xmp>

Mendefiniskan teks yang belum di format