Bagian 15. Memulai Menggunakan CSS

Apa itu CSS ?

Tahukah Anda apa CSS itu? Nah bagi Anda yang belum tahu tentang CSS, disini kita akan membahas sedikit tentang apa itu CSS, sejarah CSS, fungsi CSS dan masih banyak lagi hal yang berhubungan dengan CSS.

Pengertian dan fungsi CSS

Cascading Style Sheet (CSS) adalah salah satu bahasa pemrograman web yang digunakan untuk mempercantik halaman web dan mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS dapat kita gunakan dalam mengendalikan ukuran gambar, warna teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter lainnya.

CSS bisa juga diartikan sebagai bahasa style sheet yang digunakan untuk mengatur tampilan dokumen. Dengan adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan format yang berbeda.

Sejarah CSS

Baca Juga

Nama CSS didapat dari fakta bahwa setiap deklarasi style yang berbeda dapat diletakkan secara berurutan, yang kemudian membentuk suatu hubungan layaknya hubungan ayah-anak (parent-child) pada setiap style. CSS sendiri merupakan sebuah teknologi internet yang direkomendasikan oleh World Wide Web Consortium atau W3C pada tahun 1996.

Setelah CSS distandarisasikan, Internet Explorer dan Netscape melepas browser terbaru mereka yang telah sesuai atau paling tidak hampir mendekati dengan standar CSS.

Kelebihan CSS

Adapun beberapa kelebihan CSS adalah sebagai berikut:

Memisahkan desain dengan konten halaman web.
Mengatur desain sefisien mungkin.
Jika kita ingin mengubah suatu tema halaman web, cukup modifikasi pada css saja.
Menghadirkan sesuatu yang tidak dapat dilakukan oleh HTML.
Lebih mudah didownload karena lebih ringan ukuran filenya.
Satu CSS dapat digunakan banyak halaman web.

Contoh Penggunaan CSS adalah sebagai berikut,




<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Image</title>
</head>
<body>
<p style="color:blue">
Membuat tulisan warna biru
</p>
<p style="font-style:italic;">
Membuat tulisan miring
</p>
</body>
</html>

Priview

Membuat tulisan warna biru

Membuat tulisan miring

Download source code latihan

Akan menghasilkan 2 paragraf, :