Belajar css
Css adalah satu hal yang tidak aku bisa, maka pada catatan ini saya berharap bisa mengerti setelah menuliskannya, mungkinkah?<p>PENTING</p>
sintax css
selector { property: value }
Contoh: selector= h1
property= color
value= blue
maka css nya
h1 {color:blue;} diakhiri tanda ' ; '.
Hasilnya :<h1>hasil</h1>
hasil
Dapat juga mengelompok kan beberapa selector dengan tanda koma (,). Contoh css:
h1,h2,h3,h4,h5,h6{color:yellow;}.
Atau juga memberi banyak properti pada satu selector.
Contoh
h1 {color:red; font-family:Tahoma; text-shadow:0px 1 px 0px #ffffff;}
atau memberi sekelompok selector dng bnyak properti
contoh
h1,h2,h3 {color:red;
font-family:Tahoma;
text-shadow:0px 1 px 0px #ffffff;}
- inline css
css yang langsung di terapkan ditempat kejadian perkara (harap tidak memprotes catatanku).
Contoh
<h1 style="color:blue">h1 biru </h1>
atau <P style="color:red">paragraf merah</P>
-css diletakkan di head
diantara kode <head> dan </head>
contoh penerapan
<head><style type="text/css" media=screen>
p {color:#ff9900;}
a:link{color:#ff0000;text-decoration:none;}
</style></head>
-css eksternal
buat file ber-ekstensi css, misal style.css
kmdian didalam file style.css sematkan selector,property dan value yg hendak di atur. Misal
body {background-color:black; font-family:Arial, Goergia; text-align:left;margin:auto; padding:0px;}
p {color:blue;}
a:link{color:red;}
a:visited {color:blue;}
Kemudian utk pemanggilannya pasang kode berikut diantara kode <head> dan </head>
contoh
<head>
<link rel="stylesheet" href="http://belajar.com/style.css" type="text/css">
</head>
-import css dari rumah tetangga
kode dipasang di antara <head> sampai </head>
kode:
<head>
@import "imported_style.css"; @import url("http://rumahtetangga.com/style.css"
;</head>di mwb tinggal masuk ke kostum theme pilih blank masuk kan import nya
@import url('http://import.com/style.css'
-class
diawali dng titik pd cssnya
cntoh:
.p{color:blue;}
penerapan: <div class="p"> paragraf biru</div>
contoh lg
p .header{color:blue;}
p .post {color:ijo;}
penerapan:
<p class="header">paragraf biru</p>
<p class="post">sereeem! color ijo</p>
-font
font family
contoh eksternal css
p {font-family:Tahoma,serif;}
font size
p {font-size:12px;}
font style
p{font-style:italic;}
font weight
p {font-weight:bold;}
dan kesemua bisa disingkat dng
p {font:bold italic 12px Tahoma,serif;}
Sekian dulu.
