Belajar CSS Dengan Mudah & Cepat

CSS kepanjangan dari “Cascading Style Sheets” yang merupakan format atau style untuk tampilan website. CSS dapat dibuat dalam halaman bersama perintah HTML dengan menyisipkan tag <style> (CSS Internal / Inline) atau dibuat dengan file tersendiri yang berektensi .css yang akan dipanggil HTML dengan <link href='http://www.nurulimam.com/style.css' type='text/css' media='all' /> (CSS Eksternal).

Penulisan CSS Internal yang digabungkan dalam file HTML bisa anda lihat contohnya dibawah ini.

<style type="text/css" media="all">

body    {

width:100%;

height:100%;

overflow:auto;

clear:both;

margin:0;

padding:0;

font-family:'Palatino Linotype','Zapf Calligraphic','Book Antiqua';

font-size:medium;

background:url('../images/background/bg.jpg') center 0 repeat #1978a4;

height:100%;}

</style>

Penulisan CSS Inline yang disisipkan dalam tag HTML bisa anda lihat contohnya dibawah ini.

1	`<p style="text-align:center">Ini Tulisanku</p>`

Penulisan CSS Eksternal yang ditulis dalam file berektensi .css bisa dipanggil dengan tag HTML dibawah ini.

1	`<link href='http://www.nurulimam.com/css-eksternal-anda.css'` `type='text/css'` `media='all'` `/>`

Hal mendasar dalam CSS yang harus diperhatikan adalah ID & Class Selector. ID & Class dapat dibuat dengan kata sesuai keinginan kita & untuk penerapannya kita harus memanggil id / class dalam tag HTML.

Contoh penggunaan ID menggunakan # dalam CSS

1

2

3

4

#cssku {

    float:left;

    font-size:18px;

}

Penerapan ID dalam HTML bisa anda tulis sebagai berikut

1

2

3

<p id="cssku">

    Ini Tulisanku

</p>

Contoh penggunaan Class menggunakan . dalam CSS

1

2

3

4

.cssku {

    float:left;

    font-size:30px;

}

Penerapan Class dalam HTML bisa anda tulis sebagai berikut

1

2

3

<p class="cssku">

    Ini Tulisanku

</p>

Untuk penjelasan lebih lanjut tentang Selector & Atribut CSS akan saya bahas dalam artikel tentang pembelajaran CSS yang saya rangkum dalam Table Daftar Isi Belajar CSS Untuk Pemula.

Created By : Nurul Imam Date : 7 - November - 2013