Adistei’s Weblog

Just another WordPress.com weblog

KOMUNIKASI LOW LEVEL DENGAN SERVER SMTP

Saya tampilkan saja screenshootnya:::

Mei 22, 2008 Ditulis oleh mohamad | Tugas Cakru ARC | | Belum Ada Tanggapan

KOMUNIKASI LOW LEVEL DENGAN SERVER HTTP

Hasil telnet port 80:

<html><head><meta http-equiv="content-type" content="text/html; charset=ISO-8859
-1"><title>Google</title><style>body,td,a,p,.h{font-family:arial,sans-serif}.h{f
ont-size:20px}.h{color:#3366cc}.q{color:#00c}.ts td{padding:0}.ts{border-collaps
e:collapse}.lnc:link,.lnc:visited{color:#00c}.pgtab,.pgtab:hover,.pgtabselected,
.pgtabside{text-align:center;text-decoration:none;color:#00c;display:block;heigh
t:27px;float:left;overflow:hidden;background:url(/intl/ja/images/productlinktabs
.png) no-repeat;padding-top:8px}.pgtab{width:130px;background-position:-274px 0}
.pgtab:hover{width:130px;background-position:-144px 0}.pgtabselected{width:144px
}.pgtabside{width:3px;background-position:-404px 0}.iconl{overflow:hidden;height
:px;width:px;position:relative}#gbar{float:left;height:22px;padding-left:2px}.gb
h,.gb2 div{border-top:1px solid #c9d7f1;font-size:0;height:0}.gbh{position:absol
ute;top:24px;width:100%}.gb2 div{margin:5px}#gbi{background:#fff;border:1px soli
d;border-color:#c9d7f1 #36c #36c #a2bae7;font-size:13px;top:24px;z-index:1000}#g
user{padding-bottom:7px !important}#gbar,#guser{font-size:13px;padding-top:1px !
important}@media all{.gb1,.gb3{height:22px;margin-right:.73em;vertical-align:top
}.gb2 a,.gb2 b{display:block;padding:.2em .5em}}#gbi,.gb2{display:none;position:
absolute;width:8em}.gb2{z-index:1001}#gbar a{color:#00c}.gb2 a,.gb3 a{text-decor
ation:none}#gbar .gb2 a:hover{background:#36c;color:#fff;display:block}</style><
script>window.google={kEI:"-wctSILTF6OwwQGx3I2aDg",kEXPI:"17259,17735",kHL:"en"}
;
 function sf(){document.f.q.focus()}
                                    window.gbar={};(function(){var c=window.gbar
,e,g,h;c.qs=function(a){var d=window.encodeURIComponent&&(document.forms[0].q||”
“).value;if(d)a.href=a.href.replace(/([?&])q=[^&]*|$/,function(f,b){return(b||”&
“)+”q=”+encodeURIComponent(d)})};function l(a,d,f){a.display=h?”none”:”block”;a.
left=d+”px”;a.top=f+”px”}c.tg=function(a){var d=0,f=0,b,m=0,n,j=window.navExtra,
k,i=document;g=g||i.getElementById(”gbar”).getElementsByTagName(”span”);(a||wind
ow.event).cancelBubble=!m;if(!e){e=i.createElement(Array.every||window.createPop
up?”iframe”:”DIV”);e.frameBorder=”0″;e.scrolling=”no”;e.src=”#”;g[7].parentNode.
appendChild(e).id=”gbi”;if(j&&g[7])for(n in j){k=i.createElement(”span”);k.appen
dChild(j[n]);g[7].parentNode.insertBefore(k,g[7]).className=”gb2″}i.onclick=c.cl
ose}while(b=g[++m]){if(f){l(b.style,f+1,d+25);d+=b.firstChild.tagName==”DIV”?9:2
0}if(b.className==”gb3″){do f+=b.offsetLeft;while(b=b.offsetParent)}}e.style.hei
ght=d+”px”;l(e.style,f,24);h=!h};c.close=function(a){h&&c.tg(a)}})();</script></
head><body bgcolor=#ffffff text=#000000 link=#0000cc vlink=#551a8b alink=#ff0000
 onload=”sf();if(document.images){new Image().src=’/images/nav_logo3.png’}” topm
argin=3 marginheight=3><div id=gbar><nobr><span class=gb1><b>Web</b></span> <spa
n class=gb1><a href=”http://images.google.com/imghp?hl=en&tab=wi” onclick=gbar.q
s(this)>Images</a></span> <span class=gb1><a href=”http://maps.google.com/maps?h
l=en&tab=wl” onclick=gbar.qs(this)>Maps</a></span> <span class=gb1><a href=”http
://news.google.com/nwshp?hl=en&tab=wn” onclick=gbar.qs(this)>News</a></span> <sp
an class=gb1><a href=”http://www.google.com/prdhp?hl=en&tab=wf” onclick=gbar.qs(
this)>Shopping</a></span> <span class=gb1><a href=”http://mail.google.com/mail/?
hl=en&tab=wm”>Gmail</a></span> <span class=gb3><a href=”http://www.google.com/in
tl/en/options/” onclick=”this.blur();gbar.tg(event);return !1″><u>more</u> <smal
l>▼</small></a></span> <span class=gb2><a href=”http://video.google.com/?h
l=en&tab=wv” onclick=gbar.qs(this)>Video</a></span> <span class=gb2><a href=”htt
p://groups.google.com/grphp?hl=en&tab=wg” onclick=gbar.qs(this)>Groups</a></span
> <span class=gb2><a href=”http://books.google.com/bkshp?hl=en&tab=wp” onclick=g
bar.qs(this)>Books</a></span> <span class=gb2><a href=”http://scholar.google.com
/schhp?hl=en&tab=ws” onclick=gbar.qs(this)>Scholar</a></span> <span class=gb2><a
 href=”http://finance.google.com/finance?hl=en&tab=we” onclick=gbar.qs(this)>Fin
ance</a></span> <span class=gb2><a href=”http://blogsearch.google.com/?hl=en&tab
=wb” onclick=gbar.qs(this)>Blogs</a></span> <span class=gb2><div></div></a></spa
n> <span class=gb2><a href=”http://www.youtube.com/?hl=en&tab=w1″ onclick=gbar.q
s(this)>YouTube</a></span> ….deleted

Hasil lewat Firefox:

<html><head><meta http-equiv=“content-type” content=“text/html; charset=UTF-8″><
title>Google</title><style>body,td,a,p,.h{font-family:arial,sans-serif}.h{font-s
ize:20px}.h{color:#3366cc}.q{color:#00c}.ts td{padding:0}.ts{border-collapse:col
lapse}.lnc:link,.lnc:visited{color:#00c}.pgtab,.pgtab:hover,.pgtabselected,.pgta
bside{text-align:center;text-decoration:none;color:#00c;display:block;height:27p
x;float:left;overflow:hidden;background:url(/intl/ja/images/productlinktabs.png)
 no-repeat;padding-top:8px}.pgtab{width:130px;background-position:-274px 0}.pgta
b:hover{width:130px;background-position:-144px 0}.pgtabselected{width:144px}.pgt
abside{width:3px;background-position:-404px 0}.iconl{overflow:hidden;height:px;w
idth:px;position:relative}#gbar{float:left;height:22px;padding-left:2px}.gbh,.gb
2 div{border-top:1px solid #c9d7f1;font-size:0;height:0}.gbh{position:absolute;t
op:24px;width:100%}.gb2 div{margin:5px}#gbi{background:#fff;border:1px solid;bor
der-color:#c9d7f1 #36c #36c #a2bae7;font-size:13px;top:24px;z-index:1000}#guser{
padding-bottom:7px !important}#gbar,#guser{font-size:13px;padding-top:1px !impor
tant}@media all{.gb1,.gb3{height:22px;margin-right:.73em;vertical-align:top}.gb2
 a,.gb2 b{display:block;padding:.2em .5em}}#gbi,.gb2{display:none;position:absol
ute;width:8em}.gb2{z-index:1001}#gbar a{color:#00c}.gb2 a,.gb3 a{text-decoration
:none}#gbar .gb2 a:hover{background:#36c;color:#fff;display:block}</style><scrip
t>window.google={kEI:”aQstSISuK4PO1QbRptDpBQ”,kEXPI:”0″,kHL:”en”};
function sf(){document.f.q.focus()}
window.clk=function(b,c,d,e,f,g){if(document.images){var a=encodeURIComponent||e
scape;(new Image).src=”/url?sa=T”+(c?”&oi=”+a(c):”")+(d?”&cad=”+a(d):”")+”&ct=”+
a(e)+”&cd=”+a(f)+(b?”&url=”+a(b.replace(/#.*/,”")).replace(/\+/g,”%2B”):”")+”&ei
=aQstSISuK4PO1QbRptDpBQ”+g}return true};
window.gbar={};(function(){var c=window.gbar,e,g,h;c.qs=function(a){var d=window
.encodeURIComponent&&(document.forms[0].q||”").value;if(d)a.href=a.href.replace(
/([?&])q=[^&]*|$/,function(f,b){return(b||”&”)+”q=”+encodeURIComponent(d)})};fun
ction l(a,d,f){a.display=h?”none”:”block”;a.left=d+”px”;a.top=f+”px”}c.tg=functi
on(a){var d=0,f=0,b,m=0,n,j=window.navExtra,k,i=document;g=g||i.getElementById(”
gbar”).getElementsByTagName(”span”);(a||window.event).cancelBubble=!m;if(!e){e=i
.createElement(Array.every||window.createPopup?”iframe”:”DIV”);e.frameBorder=”0″
;e.scrolling=”no”;e.src=”#”;g[7].parentNode.appendChild(e).id=”gbi”;if(j&&g[7])f
or(n in j){k=i.createElement(”span”);k.appendChild(j[n]);g[7].parentNode.insertB
efore(k,g[7]).className=”gb2″}i.onclick=c.close}while(b=g[++m]){if(f){l(b.style,
f+1,d+25);d+=b.firstChild.tagName==”DIV”?9:20}if(b.className==”gb3″){do f+=b.off
setLeft;while(b=b.offsetParent)}}e.style.height=d+”px”;l(e.style,f,24);h=!h};c.c
lose=function(a){h&&c.tg(a)}})();</script></head><body bgcolor=#ffffff text=#000
000 link=#0000cc vlink=#551a8b alink=#ff0000 onload=“sf();if(document.images){ne
w Image().src=’/images/nav_logo3.png’}” topmargin=3 marginheight=3><div id=gbar>
<nobr><span class=gb1><b>Web</b></span> <span class=gb1><a href=“http://images.g
oogle.com/imghp?hl=en&tab=wi” onclick=gbar.qs(this)>Images</a></span> <span clas
s=gb1><a href=“http://maps.google.com/maps?hl=en&tab=wl” onclick=gbar.qs(this)>M
aps</a></span> <span class=gb1><a href=“http://news.google.com/nwshp?hl=en&tab=w
n” onclick=gbar.qs(this)>News</a></span> <span class=gb1><a href=“http://www.goo
gle.com/prdhp?hl=en&tab=wf” onclick=gbar.qs(this)>Shopping</a></span> <span clas
s=gb1><a href=“http://mail.google.com/mail/?hl=en&tab=wm”>Gmail</a></span> <span
 class=gb3><a href=“http://www.google.com/intl/en/options/” onclick=“this.blur()
;gbar.tg(event);return !1″><u>more</u> <small>&#9660;</small></a></span> <span c
lass=gb2><a href=“http://video.google.com/?hl=en&tab=wv” onclick=gbar.qs(this)>V
ideo</a></span> <span class=gb2><a href=“http://groups.google.com/grphp?hl=en&ta
b=wg” onclick=gbar.qs(this)>Groups</a></span> <span class=gb2><a href=“http://bo
oks.google.com/bkshp?hl=en&tab=wp” onclick=gbar.qs(this)>Books</a></span> <span
class=gb2><a href=“http://scholar.google.com/schhp?hl=en&tab=ws” onclick=gbar.qs
(this)>Scholar</a></span> <span class=gb2><a href=“http://finance.google.com/fin
ance?hl=en&tab=we” onclick=gbar.qs(this)>Finance</a></span> <span class=gb2><a h
ref=“http://blogsearch.google.com/?hl=en&tab=wb” onclick=gbar.qs(this)>Blogs</a>
</span> <span class=gb2><div></div></a></span> <span class=gb2><a href=“http://w
ww.youtube.com/?hl=en&tab=w1″ onclick=gbar.qs(this)>YouTube</a></span>

Mei 22, 2008 Ditulis oleh mohamad | Tugas Cakru ARC | | Belum Ada Tanggapan

HTML PROPERTIES

ALPHABETUC ORDER

Tag

Description

DTD

<!–…–>

Mendefinisikan komentar

STF

<!DOCTYPE>

Mendefinisikan tipe dokumen

STF

<a>

Mendefinisikan sebuah anchor

STF

<abbr>

Mendefinisikan singkatan

STF

<acronym>

Mendefinisikan akronim

STF

<address>

Mendefinisikan elemen alamat

STF

<applet>

Mendefinisikan applet (tidak digunakan lagi)

TF

<area>

Mendefinisikan sebuah area dalam image map

STF

<b>

Memberi style bold pada teks

STF

<base>

Mendefinisikan base URL untuk semua link pada halaman

STF

<basefont>

Mendifinisikan base font (tidak digunakan lagi)

TF

<bdo>

Mendefinisikan arah display teks

STF

<big>

Membuat teks menjadi berukuran besar

STF

<blockquote>

Membuat kutipan panjang

STF

<body>

Mendefinisikan elem bodi

STF

<br>

Memasukkan line break single

STF

<button>

Membuat push button

STF

<caption>

Mendefinisikan table caption

STF

<center>

Membuat teks berada di tengah (tidak digunakan lagi)

TF

<cite>

Membuat kutipan

STF

<code>

Membuat kode bahasa komputer

STF

<col>

Mendefinisikan atribut untuk kolom pada tabel

STF

<colgroup>

Mendefinisikan grup pada kolom tabel

STF

<dd>

Mendefinisikan deskripsi pada definisi (?_?)

STF

<del>

Mendefinisikan teks yang didelete

STF

<dir>

Membuat directory list (tidak digunakan lagi)

TF

<div>

Mendefinisikan sebuah bagian pada dokumen

STF

<dfn>

Mendefinisikan sebuah istilah definisi

STF

<dl>

Membuat sebuah daftar definisi

STF

<dt>

Membuat sebuah istilah definisi

STF

<em>

Membuat sebuah teks ter-emphasize

STF

<fieldset>

Membuat sebuah fieldset

STF

<font>

Menentukan jenis, warna, dan tipe huruf (tidak digunakan lagi)

TF

<form>

Membuat sebuah form

STF

<frame>

Membuat sebuah frame

F

<frameset>

Mendefinisikan set frame

F

<h1> to <h6>

Mendefinisikan header satu sampai enam

STF

<head>

Memberikan informasi tentang dokumen

STF

<hr>

Memberikan ukuran horizontal

STF

<html>

Membuat sebuah dokumen HTML

STF

<i>

Membuat teks dengan style italic

STF

<iframe>

Membuat inline frame

TF

<img>

Mendefinisikan sebuah image

STF

<input>

Mendefinisikan sebuah input field

STF

<ins>

Mendefinisikan teks yang di insert

STF

<isindex>

Mendefinisikan sebuah single-line input field (tidak digunakan lagi)

TF

<kbd>

Mendefinisikan teks keyboard

STF

<label>

Mendefinisikan label untuk form control

STF

<legend>

Mendefinisikan judul dalam fieldset

STF

<li>

Mendefinisikan list item

STF

<link>

Mendefinisikan referensi/daftar pustaka

STF

<map>

Mendefinisikan sebuah image map

STF

<menu>

Membuat sebuah menu list (tidak digunakan lagi)

TF

<meta>

Mendefinisikan sebuah meta information

STF

<noframes>

Mendefinisikan sebuah bagian noframe

TF

<noscript>

Mendefinisikan sebuah bagian noscript

STF

<object>

Mendefinisikan sebuah objek

STF

<ol>

Membuat sebuah ordered list

STF

<optgroup>

Membuat sebuah option group

STF

<option>

Mendefinisikan option dalam sebuah drop-down list

STF

<p>

Membuat paragraf

STF

<param>

Memberikan parameter untuk sebuah objek

STF

<pre>

Membuat preformatted text

STF

<q>

Membuat sebuah kutipan singkat

STF

<s>

Membuat teks memiliki atribut strikethrough (tidak digunakan lagi – kenapa yah?)

TF

<samp>

Membuat sampel computer code

STF

<script>

Membuat sebuah script

STF

<select>

Membuat selectable list

STF

<small>

Membuat teks berukuran kecil

STF

<span>

Mendefinisikan sebuah bagian dalam sebuah dokumen

STF

<strike>

Membuat teks strikethrough (g dipake)

TF

<strong>

Membuat teks dengan atribut strong

STF

<style>

Membuat definisi dari sebuah style

STF

<sub>

Membuat teks dengan style subscript

STF

<sup>

Membuat teks dengan style superscript

STF

<table>

Membuat tabel

STF

<tbody>

Membuat body tabel

STF

<td>

Mebuat cell tabel

STF

<textarea>

Membuat sebuah area teks

STF

<tfoot>

Membuat footer pada tabel

STF

<th>

Membuat header pada tabel

STF

<thead>

sama dengan di atas!

STF

<title>

Mendefinisikan judul dokumen

STF

<tr>

Membuat row pada tabel

STF

<tt>

Membuat teks teletype

STF

<u>

Membuat teks underline (g dipake lagi)

TF

<ul>

Membuat sebuah unordered list

STF

<var>

Mendefinisikan sebuah variabel

STF

<xmp>

Membuat preformatted text (g dipake lagi)

Mei 2, 2008 Ditulis oleh mohamad | Tugas Cakru ARC | | Belum Ada Tanggapan

CSS PROPERTIES

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

Mei 2, 2008 Ditulis oleh mohamad | Tugas Cakru ARC | | Belum Ada Tanggapan