Belajar CSS

PENGERTIAN CSS (Cascading Style Sheets)

CSS adalah salah satu bahasa pemrograman web yang mengatur komponen dalam suatu web supaya web lebih terstruktur rapi, dan indah. Jadi dalam suatu web tanpa CSS tidak akan bisa indah, dengan CSS kita dapat mengatur keindahan tampilan web kita semau kita sendiri. untuk itu perlu pembelajaran memahami CSS agar tampilan web anda dapat terlihat indah.

CARA PENULISAN CSS (Cascading Style Sheets)

Dalam penulisan CSS harus diperhatikan cara penulisannya, jika cara penulisan CSS salah, maka skrip CSS yang telah kita tulis tidak dapat dijalankan atau tidak sesuai dengan kita harapkan. Dalam penulisan CSS terdapat dua versi menurut gua yaitu :

1. Penulisan CSS dengan versi pertama

Dalam penulisan versi ini yang mana skrip CSSnya dideviniskan di awal dan baru dipanggil pendevinisiannya saat diperlukan saja. Jadi pada intinya kode CSSnya ditulis dahulu baru nanti pada saat tertentu kita dapat memakainya saat diperlukan saja dengan funsi <div> atau fungsi lainnya seperti class dll. Bahkan dalam penulisan versi ini dapat dipanggil dari file lain, misal kita membuat file dengan ekstensi/formatnya .css lalu jika kita ingin memamakainya dapat dipanggil dengan menggunakan funsi link rell untuk penulisan skrip versi pertama dibuka dengan kode <style type="text/css"> lalu tulis nama pendiskripsian skripnya misal "body" degan mengawali tanda pagar (#) atau titik (.) di depan tulisannya sehingga menjadi #body setelah itu buka kurung dengan menggunakan kurung ini ini "{" lalu baru skrip cssnya kita masukan, dengan aturan menulis kode efek cssnya lalu "titik dua" lalu kita tuliskan satuan atau warna atau yang lain tergantung dari kode efeknya. dan setiap satu pemberian efek harus ditutup dengan "titik koma ( ; ) dan tuliskan skrip nama efeknya dan seterusnya sama. dan kalau pendeskrisiannya 2 kata jangan diberi spasi tapi di sambung dengan menggunakan tanda minus( - ) jika sudah selesai menulis kode efeknya tutup tanda kurungnya lalu tulis pendeskripsain kedua jika masih ada, tulis sesuai dengan aturannya. Berikut ini sekedar contoh dari penulisan :

<style type="text/css"> #body{margin-left:0px; margin-top:0px;} #content{margin-top:20px; margin-left:0px font-size:arial;} </style>

2. Penulisan CSS dengan versi kedua

Kalau penulisan versi ini dalam setiap objeck yang mau diberi fungsi CSS kita harus menulis menyelipkannya dengan cara contoh menulis <div style=" "kode css anda ditaruh disini"> objeck yang mau diberi funsi dari CSS </div> Jadi pada intinya penulisannya kita menyelipkan objeknya diantara tag pembukan dan penutupnya. Untuk penulisan kodenya sama dengan penulisan versi pertama. Contoh :

<div style="background: #990099;">< objeck anda disini</div>

CIRI-CIRI skrip CSS (Cascading Style Sheets)

Untuk mengetahui skip CSS dalam kumpulan skrip, dan membedakan yang mana yang merupakan skrip CSS dan yang mana yang bukan. perlu diketahui ciri-ciri skrip CSS. Berikut ini adalah ciri-ciri skrip CSS :

Dalam penulisan CSS versi pertama itu cara penulisan skripnya dibuka dengan skrip &<style> , kalau penulisan versi kedua pasti dalam skrip terdapat kata "style" itu menunjukan bahwa skrip tersebut terdapat cssnya. misal seperti :

<p style="text-indent:50px;">
<SPAN style="BACKGROUND-COLOR: #FFFF00">
<textarea style=" border: 5px dashed red ;"
Dalam penulisan kode yang dua kata tidak di spasi tapi disambung dengan tanda (-) misal seperti kata margin-top, margin-left, font-size dll.

CONTOH CSS (Cascading Style Sheets)

Berikut ini adalah contoh kumpulan skrip CSS : 

<style type=text/css> p{ margin-left:200px; margin-top:-210px;} #header{ margin-top:18px; background:#9c132e; height:70px; width:57%; margin-left:20%; font-size:30px; padding:20px; text-align:center; font-family:arial; font-weight:bold; } #content { margin-top:-24px; margin-left:20%; height:400px; width:60%; background:#00b1ac; color:#000; font-size:20px; }</style>

Terima Kasih Semoga Bermanfaat.. :)