Pengertian CSS
CSS adalah singkatan dari Cascading
Style Sheet, tujuannya untuk mengatur tampilan website. Contohnya
mengatur jarak antara baris, teks, warna dan format border bahkan tampilan file
gambar. Perlu
diingat, CSS hanyalah berupa kumpulan script yang fungsinya bukan untuk
menggantikan HTML, melainkan pelengkap supaya dokumen HTML bisa tampil lebih
cantik.
Sejarah CSS
Sejak ditemukannya CSS pada awal decade 90an yang dikembangkan oleh World Wide Web Consortium (W3C), CSS terus berkembang dan diserap oleh web developer. Hingga saat ini CSS telah mencapai versi ke-3. Versi ketiga lebih mempermudah penerapan animasi diantaranya animasi warna hingga animasi 3D pada halaman website. Selain itu, fitur yang ditambahkan di CSS 3 seperti multiple background, drop-shadow, border-radius, CSS math dan CSS objek model.
Sejarah CSS
Sejak ditemukannya CSS pada awal decade 90an yang dikembangkan oleh World Wide Web Consortium (W3C), CSS terus berkembang dan diserap oleh web developer. Hingga saat ini CSS telah mencapai versi ke-3. Versi ketiga lebih mempermudah penerapan animasi diantaranya animasi warna hingga animasi 3D pada halaman website. Selain itu, fitur yang ditambahkan di CSS 3 seperti multiple background, drop-shadow, border-radius, CSS math dan CSS objek model.
Kode CSS bersifat lintas platform,
yang berarti script ini dapat dibaca oleh berbagai macam system operasi dan
browser, hanya saja browser seperti internet explorer sering kali salah
mengartikan script CSS yang menyebabkan tidak sempurnanya tampilan dokumen
HTML. Script CSS harus perlu dioptimalkan supaya tampil maksimal pada browser
internet explorer.
Memahami CSS
Belajar dasar css sebenarnya tidak
terlalu susah banget cukup memahami beberapa hal sebagai berikut :
1.
Penulisan/pendefinisian
awal kode yang akan disisipkan di dokumen HTML
Pendefinisian atau penulisan awal style bisa dilakukan pada tag <style> dapat dilihat contoh seperti berikut ini:
<style>
….
</style>
2.
Mengetahui kegunaan atau penulisan selektor ID dan class
CSS di HTML
Pada selektor ID
yang perlu diingat adalah nama ID tidak boleh sama dengan yang lain di dalam
dokumen HTML, contoh :
<div id=
“merah”>………</div>
<div
id=”hijau”>…….</div>
Lalu bagaimana
CSS mengatur ID merah dan ID hijau dapat
dilihat sebagai berikut :
<style>
#merah
{ height : 200px; width :100px; }
#hijau
{ padding: 20px; margin:0; }
</style>
Sedangkan untuk
selektor class nama boleh sama, contoh :
<div
class=”satu”>…..</div>
Untuk mengatur
selektor class diawali dengan tanda titik (.) dapat dilihat sebagai berikut :
<style>
.satu
{ height : 200px; width :100px; }
</style>
3.
Mengetahui aturan penulisan kode CSS untuk mengatur tag HTML.
Pada tag HTML
seperti <body>, <h1>,<h2>< <hr>, <p>,
<form>, <table> <a> dan yang lain-lain sobat bisa mencari di
goole mengenai tag HTML, contoh :
Body { Background
: red; }
4.
Mengetahui
property CSS dan value/nilai propertinya.
Property CSS
sangat banyak, disini hanya beberapa
yang ditulisakan yaitu background, padding, margin, width, height, color,
font-family dan lainnya, contoh :
Backround : red;
Margin: 10px 20px
0 4px;
Height: 200px;
2 comments
Thanks artikelnya sangat membantu.
Artikelnya boleh dicoba bagi yang ingin mempercantik blog,buat template
Berkomentar yang baik dan sopan ya sobat