Apa itu CSS?

2013-12-28T17:49:00.000+07:00

Definisi CSS

Mungkin anda ada yang bertanya-tanya, apa itu CSS? Dan apa fungsinya?

Menurut defini saya sendiri CSS (Cascading Style Sheet) adalah sekumpulan kode yang berfungsi menata tata letak halaman dan bertanggung jawab atas penampilan pada suatu website. Di dalam dunia web design, CSS adalah suatu kode yang dianggap wajib oleh para web designer , karena selain untuk menata tampilan pada halaman website, CSS ini juga berfungsi sebagai SEO (Search Engine Optimization). Bayangkan jika suatu website tanpa mempunyai kode CSS didalamnya, sungguh membuat pengunjung merasa tidak nyaman bukan? Maka oleh sebab itu kode yang diatur oleh W3C ini sangatlah berperan penting. Oh iya sebelum anda mempelajari apa itu CSS, alangkah baiknya anda mempelajari apa itu HTML. Karena percuma apabila kode CSS kita bagus tapi tidak bernampak di browser ya? :D . Dari tadi ngomongin definisi CSS melulu ya, mending langsung saja ke inti.

Penulisan CSS

Hmm, penulisan CSS. Mengenai hal itu saya akan berkomentar bahwa penulisan CSS itu ada 3 macam. Apa aja sih?

Jenis-jenis penulisan CSS:

Inline CSS
Internal CSS
External CSS

Wah ada 3 ya? Lalu gimana?

Inline CSS

Inline CSS adalah suatu jenis penulisan CSS yang berada di dalam tag HTML atau lebih tepatnya di dalam atribut style.

Saya akan memberi contoh penulisan CSS jenis ini di dalam suatu HTML, berikut kodenya :

<!DOCTYPE html>
<html>
<head>
<title>Ilmu CSS</title>
</head>
<body>
<p style="background: black">Ini adalah contoh paragraph</p>
</body>
</html>

Yang diberi warna putih itu merupakan contoh dari kode CSS inline yang disisipkan di dalam sebuah tag HTML dan pada atribut style yang kebetulan pada tag p (paragraph). Dan yang diberi warna hijau itu adalah kode CSSnya.

Internal CSS

Mengenal kata internal, anda pasti dapat mentimpulkan bahwa itu adalah CSS yang berada didalam. Ya, memang benar CSS itu berada di dalam, tepatnya didalam suatu HTML. Penulisan Internal CSS ini adalah didalam tag <style> dan tag <style> itu berada di tag <head>. Daripada bingung langsung saja kita lihat kodenya:

<!DOCTYPE html>
<html>
<head>
<title>Ilmu CSS</title>
<style>
body { background-color: black }
</style>
</head>
<body>
<p>Paragraph</p>
</body>
</html>

Yang diberi warna merah adalah tipe penulisan CSS internal dan yang berwarna biru itu adalah kode CSSnya.

External CSS

Kalo ada internal, pasti juga ada lawannya yaitu external (diluar) . Penulisan CSS jenis ini memungkinkan anda menulis kode CSS diluar HTML lebih tepatnya membuat file baru yang berformat .css (misal: ilmu-css.css) dan didalam tag link dan didalam tag href. Jenis penulisan CSS ini adalah penulisan yang sangat digemari oleh para web designer karena dianggap menyederhanakan script CSS bahkan dianggap efisien. Saya tidak akan membahasnya. Jadi, langsung saja ke contoh kodenya saja.
Misalkan, kita mempunyai kode HTML begini dan kita ambil contoh nama file CSSnya ilmu-css.css:
File HTML:

<!DOCTYPE html>
<html>
<head>
<title>Ilmu CSS</title>
<link rel="stylesheet" href="ilmu-css.css" />

</head>
<body>
<p>Paragraph</p>
</body>
</html>

File CSS (ilmu-css.css):

body { background-color: black}
p { color: white }

Dari kedua file diatas, bisa saya simpulkan bahwa pemanggilan CSS dengan tipe penulisan ini kita harus membuat tag link didalam tag head dan isi dari atribut href itu adalah url file CSS kita berada. Dan di file ilmu-css.css itu kita dapat leluasa memasukkan file CSS.

Mungkin hanya itu saja yang bisa saya jelaskan . Terimakasih
Salam Ilmu CSS !

Ilmu CSS

2013-12-28T17:04:00.000+07:00

Halo pengunjung Ilmu CSS.
Disini saya hanya ingin menerangkan apa sih fungsi blog ini?

Latar Belakang

Ilmu CSS adalah sebuah blog yang berisi ilmu tentang CSS. Blog ini dibuat pada tanggal 28 Desember yang dikelola oleh seorang yang bernama Wildan MR. Ya, saya memang bukanlah ahli sepenuhnya tentang CSS. Bahkan saya newbie :D . Tapi disini saya mempunyai tekad untuk menginformasikan tentang ilmu CSS yang saya pernah ketahui , diharapkan anda sebagai pengunjung dapat menerimanya dengan baik.

Metode

Mungkin saya akan menjelaskan perihal CSS ini melalui bahasa saya. Jujur saja bahasa saya tidak sebagus bahasa yang ada di blog lain.

Kesimpulan

Mungkin hanya itu sambutan dari saya, semoga blog ini bermanfaat bagi kita.
Salam Ilmu CSS !