CSS adalah singkatan dari Cascading Style Sheets. Berisi rangkaian
instruksi yang menentukan bagiamana suatu text akan tertampil di halaman
web. Perancangan desain text dapat dilakukan dengan mendefinisikan
fonts (huruf) , colors (warna), margins (ukuran), latar belakang
(background), ukuran font (font sizes) dan lain-lain. Elemen-elemen
seperti colors (warna) , fonts (huruf), sizes (ukuran) dan spacing
(jarak) disebut juga “styles”. Cascading Style Sheets juga bisa berarti
meletakkan styles yang berbeda pada layers (lapisan) yang berbeda. CSS
terdiri dari style sheet yang memberitahukan browser bagaimana suatu
dokumen akan disajikan.
CSS dibuat untuk memisahkan konten utamadengan
tampilan dokumen yang meliputi layout, warna da font. Pemisahan ini
dapat meningkatkann daya akses konten pada web, menyediakan lebih banyak
fleksibilitas dan kontrol dalam spesifikasi darisebuah karakteristik
dari sebuah tampilan, memungkinkan untuk membagi halaman untuk sebuah
formatting dan mengurangi kerumitan dalam penulisan kode dan struktur
dari konten, contohnya teknik tableless pada desain web.
CSS juga memungkinkan sebuah halaman untuk ditampilkan
dalam berbagai style dengan menggunakan metode pembawaan yang berbeda
pula, seperti on-screen, in-print, by voice,
dan lain-lain. Sementaraitu, pemilik konten web bisa menentukan link
yang menghubungkan konten dengan file CSS.
Tujuan utama CSS diciptakan untuk membedakan konten
dari dokumen dan dari tampilan dokumen, dengan itu, pembuatan ataupun
pemrograman ulang web akan lebih mudah dilakukan. Hal yang termasuk
dalam desain web diantaranya adalah warna, ukura dan formatting. Dengan
adanya CSS, konten dan desain web akan mudah dibedakan, jadi
memungkinkan untuk melakukan pengulangan pada tampilan-tampilan tertentu
dalam suatu web, sehingga akan memudahkan dalam membuat halaman web
yang banyak, yang pada akhirnya dapat memangkas waktu pembuatan web.
fungsi css
fungsi utama css adalah merancang, merubah, mendisain, membentuk halaman wesite(blog juga website). dan isi dari halaman website adalah tag-tag html, logikanya css itu dapat merubah tag-tag html(yang sederhana) sehingga menjadi lebih fungsional dan menarik.Fungsi dan Kegunaan CSS
Awal mula diperlukannya CSS dikarenakan kebutuhan akan halaman web yang semakin kompleks. Pada awal kemunculan HTML, kita bisa membuat suatu paragraf bewarna merah dengan menulis langsung kode tersebut didalam tag HTML, atau membuat latar belakang sebuah halaman dengan warna biru. Contoh kode HTML untuk hal itu adalah sebagai berikut:<!DOCTYPE html> <html> <head> <title>Test Tag Font HTML</title> </head> <body> <p> CSS merupakan bahasanya <font color="red">desainer web</font>. Namun sebenarnya, apa itu CSS? <br /> <font color="red">CSS </font> adalah kumpulan kode yang digunakan untuk mendefenisikan desain dari bahasa markup, <font color="red">salah satunya adalah HTML</font>. <br /> Dengan CSS kita bisa mengubah desain dari <font color="red">text, warna, gambar dan latar belakang</font> dari (hampir) semua kode tag HTML. </p> </body> </html>
Saya menggunakan tag <font> untuk membuat beberapa kata di dalam paragraf tersebut berwarna merah. Hal ini tidak salah, dan semuanya berjalan sesuai keinginan. Untuk sebuah artikel yang memiliki 5 paragraf, kita tinggal copy-paste tag <font color=”red”> pada kata-kata tertentu.
Namun setelah website tersebut memiliki katakanlah 50 artikel seperti diatas, dan karena sesuatu hal anda ingin merubah seluruh text merah tadi menjadi biru, maka akan dibutuhkan waktu yang lama untuk mengubahnya satu persatu, halaman per halaman.
Dalam kondisi inilah CSS mencoba ‘memisahkan’ tampilan dari konten. Untuk paragraf yang sama, berikut kode HTML bila ditambahkan kode CSS:
<!DOCTYPE html>
<html>
<head>
<title>Test Background Color CSS</title>
<style type="text/css">
.warna {
color: red;
}
</style>
</head>
<body>
<p>
CSS merupakan bahasanya <span class=warna>desainer web</span>.
Namun sebenarnya, apa itu CSS?
<br />
<span class=warna>CSS </span>adalah kumpulan kode
yang digunakan untuk mendefenisikan desain dari bahasa markup,
<span class=warna>salah satunya adalah HTML</span>.
<br />
Dengan CSS kita bisa mengubah desain dari
<span class=warna>text, warna, gambar dan latar belakang</span>
dari (hampir) semua kode tag HTML.
</p>
</body>
</html>
Dalam contoh CSS diatas, saya mengubah tag <font> menjadi tag <span>. Tag <span> sendiri merupakan tag yang tidak bermakna, namun bisa di kostumasi menggunakan CSS. Tag span saya tambahkan dengan atribut atribut class=”warna”. Atribut class berguna untuk memasukkan kode CSS pada tag <style> di bagian head. (Lebih lanjut tentang tag <span>, telah kita bahas di tutorial belajar HTML lanjutan: pengertian tag span dan div)
Jika kita ingin merubah seluruh warna menjadi biru, maka tinggal mengubah isi dari CSS color: red menjadi color:blue, dan seluruh tag yang memiliki class=”warna” akan otomatis berubah menjadi biru.
Tidak ada komentar:
Posting Komentar