-->


CSS Selector Modal Dasar Belajar CSS3

Trick CSS Selector Sebagai Modal Awal Kalian Belajar Cascading Style Sheet atau CSS3. Emang nggak sepenuhnya bener seh, soale aku pertama kali belajar CSS itu dari Edit HTML di blog. Sebenernya agak sama kok dengan Edit HTML yang aku terapkan dulu, yang membedakan hanya pas kita membubuhkan ID dan tanda # ( pagar ) untuk setiap memulai coding CSS hehe agak ribet neh neranginnya. Dan untuk melengkapi pembacaan pada browser yang berbeda-beda, maka kita harus membubuhkan -moz- (untuk mozilla firefox), -webkit- (untuk Safari dan Chrome), -0- (untuk Opera), -ms- (untuk IE) dan -khtml- (untuk Conqueror). Sedikit akan aku uraikan dibawah, semoga nggak salah, dan kalaupun salah, tolong diralat lewat message aja zob. Soale aku juga masih harus belajar kok.

CSS diawali dengan # tanda pagar
Kemudian tanda kurung kurawal di awal
dan tutup kurung kurawal di akhir

Misal buka link disamping : devilzsample.

#contoh
}
bla bla bla
{

dan Syntax style
<style type="text/css"> untuk pembukaannya
</style> untuk penutupnya
!! ingat tanda slash di depan style itu pertanda bagian akhirannya

Misal langsung aja seperti ini ::



<html>
<head>
<title>Selector CSS by agung</title>
<style>
body {
width:100%;
height:500px;
clear:both;
background:red;
margin:10px 10px 10px 10px;
padding:10px 10px 10px 10px;
border:5px inset #000000;
}
#sidebarkiri {
background:yellow;
float:left;
width: 200px;
height:305px;
margin:5px 5px 5px 5px;
padding:5px 5px 5px 5px;
border:2px inset #000000;
}
#badan {
background:blue;
margin:0;
width: 500px;
height:305px;
float:left;
margin:10px 10px 10px 10px;
padding:10px 10px 10px 10px;
border:5px inset #000000;
}
#sidebarkanan
{
background:yellow;
width:200px;
height:305px;
float:left;
margin:5px 5px 5px 5px;
padding:5px 5px 5px 5px;
border:2px inset #000000;
}
#judulsidebarkiri
{
background:green;
color:black;
font-size:12px;
margin:3px 3px 3px 3px;
padding:3px 3px 3px 3px;
border:1px solid #000000;
}
#judulbadan{
background:red;
color:silver;
font-size:24px;
margin:3px 3px 3px 3px;
padding:3px 3px 3px 3px;
}
#judulsidebarkanan
{
background:green;
color:black;
font-size:12px;
margin:3px 3px 3px 3px;
padding:3px 3px 3px 3px;
border:1px solid #000000;
}
</style>
<head>
<body>
<div id="sidebarkiri">
<h2 id="judulsidebarkiri">sidebar kiri by agung</h3>
</div>
<div id="badan">
<h2 id="judulbadan">BADAN / agung wisudhatama</h3>
</div>
<div id="sidebarkanan">
<h2 id="judulsidebarkanan">sidebar by agung</h3>
</div>
</body>
</html>

Itu CSSnya langsung kalian taruh di Notepad
dan simpan dengan ekstensi .html
Misal : template.html

Kemudian buka di browser
Pasti dah jadi tuh ..
Blogger Yang Baek, Meninggalkan Jejak Berupa Komentar

Agan jadi Cuapers ke 5, CONGRATULATE !

▒▒▓╠░BATMAN-KEBLINGER░╣▓▒▒ hobby ngeTweet [agi ngeComment]

assalamualikum.mampi gan.

Ismailmobile hobby ngeTweet [agi ngeComment]

nyimak and mampir dong gan ke blog ku
http://ismailred.mywapblog.com/

Satriyo Arif hobby ngeTweet [agi ngeComment]

Nice Infonya Kunjungan balik ya gan

loveheaven07 hobby ngeTweet [agi ngeComment]

ribet emang lah

puisi dan pendidikan hobby ngeTweet [agi ngeComment]

nih emang bener2 mantap kang... lagi nyimak nih

:10 :11 :12 :13
:14 :15 :16 :17
:18 :19 :20 :21
:22 :23 :24 :25
:26 :27 :28 :29
:30 :31 :32 :33
:34 :35 :36 :37
:38 :39 :40 :41
:42 :43 :44 :45
:46 :47 :48 :49
:50 :51 :52 :53
:54 :55 :56 :57
:58

Jangan lupa ada emo Kaskus diatas CommentBox Ini. Langsung dicoba gan ? Entar ane kasih cendol dah.

Protected by Copyscape Web Plagiarism Software
English French German Spain Italian DutchRussian Portuguese Japanese Korean Arabic Chinese Simplified