Sunday, 3 April 2016

CASCADING STYLE SHEETS (CSS)

CSS merupakan kumpulan perintah yang direka dari berbagai sumber yang disusun menurut urutan tertentu sehingga mampu mengatasi masalah style. CSS salah satu bahasa pengaturcaraan web yang mengatur komponen dalam laman web supaya laman lebih berstruktur dan seragam. CSS secara amnya mengatur warna body teks, ukuran, border, warna jadual dan hyperlink, margin, padding, paragraph spacing dan banyak lagi. Format V ini dapat menampilkan halaman yang sama dengan format yang berbeza

Sejarah CSS
CSS pertama kali bermula pada tahun 1970 – an sejak kemunculan SGML. Sejak itu, CSS mengalami perkembangan yang sangat pesat. CSS adalah hasil cetusan idea seorang programmer yang bernama Hakon Wium Lie semasa cadangannya mengenai Cascading HTML Style Sheet (CHSS) pada Oktober 1994 dalam konferensi W3C di Chicago). Kemudian, Lie bersama Bert Bos mengembangkan standard V. Pada tahun 1996, SCC rasmi telah dikeluarkan. Projek ini turut disokong oleh seorang programmer iaitu Thomas Reardon dari Microsoft. Nama dicetuskan melalui fakta style yang berbeza dapat diletakkan secara berurutan, dan mampumembentuk hubungan parent – child pada setiap style. CSS turut menjadi sebuah teknologi internet yang dipilih oleh World Wide Web Consortium atau W3C pada tahun 1996. Selepas itu, CSS dipiawaikan untuk kegunaan browser. Internet Explorer dan Netscape mengeluarkan browser terbaru mereka yang hamper sama mencapai standard CSS.

Sifat CSS
  •         Internal – Memasukkan skrip CSS secara langsung ke dalam laman web.
  •        External – Skrip CSS dipisahkan dan diletakkan dalam fail khusus. CSS akan dipautkan menuju ke ke fail HTML melalui tag – tag pada head.

Cara Penulisan CSS
  •  Inline Style Sheet
  •  Embedded Style Sheet



Tanda atau simbol CSS 

body {
    background:lightcyan;
   }

Tanda {} dinamakan selector, teks yang diapit oleh {} dinamakan declaration yang terdiri dari 2 unsur iaitu property dan value. Selector dalam penyataan diatas adalah ‘body’, ‘background’ adalah property dan ‘lightcyan’ adalah value

Inline style sheet ini boleh ditulis dengan menambah style=”...” dalam tag HTML. Style hanya berlaku pada tag yang bersangkutan sahaja. Bukan pada keseluruhan laman. Contohnya;


<p style=”color:red ; font-size:20px ;”> Tag P adalah untuk paragraph. Tag ini berwarna merah dan font sebesar 20px </p>

Cara penulisan Embedded Style Sheet adalah dalam tag seperti berikut <style>... </style> diatas <body>.Contohnya;


<style>
Body {
Background:lightblue ;
Font-family:century gothic ;}
H1{
Font-size:200% ;
Color:snow ;}
</style>
<body>
<h1>Tajuk ini berukuran standard H1 dan berwarna putih salji</h1>
</body>

Kelebihan CSS
  •  Mengemaskini tampilan lebih mudah.
  •   Beban bandwith yang lebih kecil.
  • Memisahkan gaya rekaan dengan kandungan halaman web
  • Modifikasi web template yang lebih mudah
  •   Lebih mudah digunakan pada peranti mudah alih seperti smartphone
  • Menyusun reka bentuk dengan efisyen
  • Satu fail CSS yang boleh digunakan oleh banyak halaman
  •  Mudah dimuat turun atau di muat naik keran ukuran fail yang kecil
Kekurangan CSS
  • Paparan pada setiap browser berbeza
  • Terdapat browser yang tidak dapat menyokong CSS contohnya browser lama
  • Perlu tahu cara menggunakannya
  • Memerlukan waktu yang lama untuk membuat dan menyusun tag CSS
  • Tiada lagi bug / error dalam CSS

No comments:

Post a Comment