Welcome GuestFriday, 2025-01-31, 0:40 AM

Free Your Voice


Main » 2010 » October » 29 » CSS (Cascading Style Sheets)
4:47 AM
CSS (Cascading Style Sheets)

CSS (Cascading Style Sheets)
adalah suatu bahasa style sheet yang dituliskan dalam bahasa markup (penanda) dengan tujuan untuk mengatur tampilan dari suatu dokumen atau website yang ditulis. CSS digunakan untuk menentukan warna, jenis huruf, tata letak, style yang lainnya. Sintak CSS terdiri dari tiga bagian, yaitu pemilih (selector), property, dan nilai (value). Selector adalah elemen atau tag HTML yang akan didefinisikan. Property adalah atribatu yang akan diganti dengan value tertentu. properti dan nilai dipisahkan oleh ":" dan diapit oleh "{}".

Contoh

property pengaturan text, paragraf, style text
didalam CSS :
1. font - family
2. font - style
3. text - align
4. text - decoration

5. text - transform
6. fonr - variant
7. font - weight
8. white - space

properti pengaturan warna, background didalam CSS :
1. color
2. background - color
3. background - image
4. background - repeat
5. background - attachment
6. background - position
7. background

properti format visual elemen HTML didalam CSS :
1. positio
2. overflow dan clip
3. widht dan weight
4. top, right, bottom, dab left
5. margin, border, padding
6. float dan  clear

properti pengaturan tabel di dalam CSS :
1. border - collapse
2. border - spacing
3. caption - site
4. emty - cells
5. table - layout

Contoh Code CSS :



/* ************ Transparant Border ************ */

#side a:link, #side a:visited, #footer a:link, #footer a:visited, .title a:link, .title a:visited, .tags a:link, .tags a:visited {color:#FF7300;}

#side h2, #side caption {text-transform:uppercase; font-size:17px; background:url("") repeat-x scroll left top transparent;}
#latestposts li {background:url("") no-repeat scroll left center transparent;}
#friendz li,  #friendz a:link, #friendz a:visited, #friendz a:active {background:url("") no-repeat scroll left center transparent;}
#side #twitter-link, #side #twitter-link:visited {background:url("") no-repeat scroll left center transparent;}
#calendar{background:url("") no-repeat scroll left center transparent;}



/* ************Hhhh************ */
h2{color:red;text-align:center;font-family : comic sans ms;}
a.visited {color : #FF0000;}
#visitors li, #visitors a:link, #visitors a:visited, #visitors a:active, #myfavs a:link, #myfavs a:visited, #myfavs a:active {background:url("") repeat scroll left center transparent;
}


/* ************Kode Menu Shadow************ */
#menu {height:0px;background-image:none;background:transparent url:none; top left no-repeat;border:10px !important;}
#menu ul {min-width:800px;max-width:800px;float:right;}
#menu a, #menu a:link, #menu a:visited {background-image:none;
border:0px;color:#999999;font-size:17px !important;font-weight:bold;font-family : "Courier New";}
#top #menu a:hover, #menu
a#selected:link, #menu b#selected:visited { text-decoration: blink;background-image:none; background:transparent;border:0px;color:red;text-shadow: 2px 2px 4px yellow;}
#menu * {background:none !important;}




/* ************ Kode Text Shadow ************ */
a:visited { text-decoration: blink;font-style:italic;color:red;text-shadow: 2px 2px 4px red;}
a:hover { color : red;text-decoration: underline;text-decoration: blink; font-size: 20px; }
a:link { text-decoration: blink; color :#FF0000} 
a:active { text-decoration: none; color :#FD9F02;} 



/* ************Kode Menu Side Bar************ */
#newcomments h2 {color:#FF0000;font-family:comic sans ms;font-size:15px;}
#shoutbox h2 { font-family: comic sans ms;font-size:15px; color :#FF0000;}
#latestposts h2{font-family: comic sans ms;font-size:15px;color :#FF0000;}
#latestcomments h2 {font-family: comic sans ms;font-size:15px;color :#FF0000;}
#newcomments h2{font-family: comic sans ms;font-size:15px;color :#FF0000;}
#newcomment h2 span: after {font-family: comic sans ms;font-size:15px;color :#FF0000;}
#visitors h2{font-family: comic sans ms; font-size:15px;color :#FF0000;}
#blogsearch label{font-family: comic sans ms; font-size:15px;color :#FF0000;}
#friends label{font-family: comic sans ms;font-size:15px;color :#FF0000;}


/* ************ Kode Background ************ */
#top2 {height:150px; background:#000 url(http://punkandanimalrights.com/images/PunkRockHeader.jpg);}
body {color: orange;}
body, #wrap4 {background:#000 url(http://files.myopera.com/Furie/themes/thief.jpg)top center repeat;background-attachment:fixed;

/* ************Kode Comment************ */
.readmore a{content:"lanjutkan_cerita...";}
.comment1 {background: #FFFF01 url ()repeat-y;}
.comment2 {background: #blue url ()repeat-y;}
.ownercomment {background: #D8D8D8 url()repeat-y;}
.comments .text {margin:0 0 0 15px;color:#FF00CC;text-shadow:3px 3px 3px #FFCC33;}



Category: KoMpuTer | Views: 3399 | Added by: Nazk | Rating: 0.0/0
Total comments: 5
5 prodvizhenie-sayta-v-internet  
0
вы знаете , где я могу найти резюме книги?

4 IGF 1 R3  
0
Anda punya website yang sangat besar, Senang saya melihat melalui yahoo.

3 escort montreal  
0
Comment faire une sélection de la catégorie sur wordpress utiliser un autre domaine?

2 dubai call girls  
0
Anda punya website yang sangat besar, Senang saya melihat melalui yahoo.

1 winstrol  
0
Terima kasih atas kritik yang masuk akal. Me & tetangga saya hanya bersiap-siap untuk melakukan penelitian tentang hal ini. Kami punya ambil sebuah buku dari perpustakaan lokal kami tapi saya pikir saya belajar lebih banyak dari posting ini. Saya sangat senang untuk melihat informasi yang besar seperti sedang bersama bebas di luar sana.

Name *:
Email *:
Code *:
Category
tiPz & tRikz [4]
KoMpuTer [3]
neTwoRk [2]
Code pRoGram [5]
OuTdooR [0]
Live sTyLe [0]
mY VoiCe [3]
AdvErTiseMenT [0]
cORd muSic [1]
tuGas camPuz [2]
yOur pooL
Rate my site
Total of answers: 3
seArcH
Geographic Photo
LoGin
CaLenDer
«  October 2010  »
SuMoTuWeThFrSa
     12
3456789
10111213141516
17181920212223
24252627282930
31
CLocK
mp3
GoogLe SerViCe
Classic aRt