Selasa, 15 Januari 2013

TEKNIK DASAR CSS (Cascading Style Sheet )

selamat datang pengunjung setia blog RocKrr
kali ini saya akan memposting artikel mengenai teknik dasar CSS,, atau (Cascading Style Sheet )
Ok deh sedikit tentang penjelasan mengenai CSS, silahkan baca dulu
Pengertian CSS (Cascading Style Sheet)
Cascading Style Sheet apalagi ini?. Mungkin sebagai orang awam anda tentu belum mengenal
apa itu CSS. Cascading Style Sheet adalah suatu teknologi yang digunakan untuk
mempermudah pembuatan suatu tampilan sebuah website.
Jangan mengernyitkan dahi, anggap saja ini mudah. Dengan menggunakan CSS kita dapat
mempercepat pembuatan situs sekaligus mempermudah kita dalam proses mengeditnya.
Pada bab 5 ini kita akan mencoba menerapkan penggunaan CSS dalam beberapa contoh yang
sederhana. Selanjutnya kita akan merubah format tampilan personal homepage yang telah
kita buat pada bab 3 dengan menambahkan CSS kedalamnya..
Ok deh, jangan banyak teori langsung saja praktek,
silahkan buka notepad dan ketikkan


body{font-family: verdana; font-size: 12px}
td{font-family: verdana; text-align: center}
a{font-color: green; text-decoration: none}
a:hover{background-color: yellow; font-weight: bold}
a:hover.green{background-color: green; color: yellow}

kemudian save as,, pilih all files, dan beri nama dengan my_css.css
langkah selanjutnya buat file html,
!, buka notepad
2. ketikkan kode berikut


<html>
<head>

<title>Meload CSS dari File</title>
<link rel="stylesheet" href="my_css.css" type="text/css">
</head>
<body>
<p>Penerapan CSS pada halaman ini melalui media file. Bukan menuliskannya
langsung diantara tag head.</p>
<p><table border="1" style="border-collapse: collapse" width="75%"
cellpadding="8" bordercolor="black">
<tr>
<td><a href="#">Ini link biasa</a></td></tr>
<tr>
<td><a href="#" class="green">Ini link dengan class</a></td></tr>
</table></p>
<p>Dari contoh 2 link diatas dimana link 2 masih mendapat efek tebal dari hover
biasa. Namun dia juga mendapat efek sendiri yaitu background hijau dan warna
kuning. Yang seperti ini juga biasa disebut dengan <b>PEWARISAN
(inheritance)</b>.</p>
</body>
</html>

kemudian save as-pilih all files-dan simpan dengan nama file_css.css
langkah selanjutnya buka file_css.css dan lihat apa yang akan terjadi,,
ok, mungkin itu saja materi yang saya tulisakan tentang materi TEKNIK DASAR CSS (Cascading Style Sheet ) ini, apabila ada salah penulisan atau wajah saya yang kurang berkenan saya mohon maaf,, maaf untuk para webmaster, tolong jangan di tertawakan artikel ini,, karen penulis sendiri juga masih miyabi.. eh newbie,, heheheh,, salam programmer indonesia,




0 komentar:

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More