Wednesday, August 3, 2011

Mari Belajar HTML Bahagian 2 (CSS)





Kita telah pun mempelajari HTML pada bahagian 1
Pada kali ini saya akan menunjukkan asas menggunakan css pada html.
CSS bermaksud Cascading Style Sheet digunakan bagi memudahkan kerja merekabentuk sesebuah laman web. Memang benar kita boleh buat design yang cantik tanpa CSS, tapi kalau 100page??? Penatlah nak design tiap2 page.. 

Cara meletakkan fail css pada html hanya manggunakan sebaris kod seperti dibawah:
<head>
<link href="namaFail.css" rel="stylesheet" type="text/css" media="screen" />
</head>

Pada fail html, kita akan gunakan div tag dan bagi meletakkan design pada fail css
  • <div id="namaId">
  • <p>Contoh text</p>
  • <h1>Head 1</h1>
  • <h2>Head 2</h2>
  • <a href="fail.html">Link</a>
  • <img src="gambar.jpg" alt="gambar" width="100px" height="100px">
  • </div>
id pada div tag akan menghubungkan design dari fail css ke fail html

#namaId {
    design seluruh bahagian namaId contoh- tetak background color, kedudukan(center, left,           top, bottom, right) 
}

#namaId p {
   design untuk <p> atau paragraph
}

#namaId h1 {
   design untuk <h1> 
}

#namaId h2 {
   design untuk <h2> 
}

#namaId a {
   design untuk link
}

#namaId img {
   design untuk gambar
}

Note: Abaikan tanda titik hitam di tepi.

0 comments:

Post a Comment