0

Dasar dan Pengertian CSS

CSS (Cascading Style Sheets) digunakan dalam kode HTML untuk menciptakan suatu kumpulan style yang terkadang dapat digunakan untuk memperluas kemampuan HTML. Misalnya untuk mengatur font dengan kode HTML murni pada sebuah tabel, maka akan sangat merepotkan, karena tag <BASEFONT> tak berpengaruh pada sel-sel table, sehingga semua sel harus diformat ulang untuk font tersebut. Misal, font yang diinginkan besarnya 12, dengan menggunakan tag <font>, semua sel harus diformat dengan menggunakan <font size="12">. Tentu saja hal ini tidak praktis. Apabila memakai code CSS, Anda hanya perlu mendefinisikan style tersebut sekali saja, dan style tersebut berlaku untuk keseluruhan sel table. Hal tersebut merupakan gambaran sekilas tentang CSS.

Mencoba CSS



Sebelumnya marilah kita mencoba code CSS berikut:
<HTML>
<HEAD>
<TITLE>Mencoba CSS</TITLE>
<STYLE TYPE = "text/CSS">
<!--
H1 { font-size:18pt;
    font-weight:bolt;
    color:blue;
    background-color:yellow;}
--!>
</STYLE>
</HEAD>
<BODY>
<H1> Mencoba CSS</H1>
Bagaimana percobaannya? Berhasil apa tidak?
</BODY>
</HTML>

Maka hasilnya adalah:


Dari gambar terlihat bahwa background untuk judul (yang telah di tag dengan code <H1>) berwarna kuning, warna font biru, dan font terlihat tebal dengan ukuran font 18 pt, sedangkan bagian isinya tanpa memakai CSS dengan font default.

Sekarang marilah kita mendalami kode CSS ini.
1. Kode CSS ini diletakkan antara <HEAD> dan </HEAD>
2. Pasangan tag <STYLE> dan </STYLE> digunakan untuk mendefinisikan style sheets code CSS. Oleh karenanya, terdapat attribute TYPE dengan nilai adalah "text/CSS"
3. Pasangan tag <!-- dan --> adalah komentar dalam HTML. Pasangan tag ini diletakkan dengan tujuan untuk meletakkan komentar para pemrogram. Penulisan tag ini tidak menjadi keharusan.
4. Format code CSS tersebut adalah:
nama_tag { property_1:nilai_1;property_2:nilai_2;property_n:nilai_n; }
keterangan:
*nama_tag adalah tag untuk code CSS yang selanjutnya dapat dipanggil untuk style untuk font.
*tanda titik dua (:) diletakkan setelah property.
*tanda tanda titik koma (;) diletakkan untuk mengakhiri property atau diletekkan sebelum property berikutnya, sehingga property yang satu dengan yang lain terpisahkan oleh tanda titik koma.

andry

Phasellus facilisis convallis metus, ut imperdiet augue auctor nec. Duis at velit id augue lobortis porta. Sed varius, enim accumsan aliquam tincidunt, tortor urna vulputate quam, eget finibus urna est in augue.

Tidak ada komentar:

Posting Komentar

Budayakan memberi masukan saran & kritik
demi memajukan blog kami
maree tinggalkan jejak
jangan sungkan-sungkan berkunjung lagi ...