Apa Itu HTML dan CSS?
HTML dan CSS adalah bahasa pemrograman yang menjadi dasar dari pengembangan web. Mereka bekerja sama untuk menciptakan tampilan dan fungsionalitas dari halaman web yang Anda lihat setiap hari.
HTML: Struktur Dasar Web
HTML (HyperText Markup Language) adalah bahasa yang digunakan untuk mendefinisikan struktur dari sebuah halaman web. Bayangkan HTML seperti kerangka tulang dari sebuah website. Ia menentukan bagaimana konten diatur dan disusun.
Beberapa elemen HTML yang umum:
<html>: Elemen induk yang menyelimuti seluruh halaman web.<head>: Bagian yang berisi informasi meta tentang halaman web, seperti judul dan deskripsi.<body>: Bagian yang berisi konten yang terlihat oleh pengguna, seperti teks, gambar, dan video.- <h1> - <h6>: Tag judul dengan berbagai level.
<p>: Paragraf teks.<img>: Menampilkan gambar.<a>: Link ke halaman lain.
CSS: Gaya dan Tampilan
CSS (Cascading Style Sheets) digunakan untuk menentukan gaya dari sebuah halaman web. Dengan CSS, Anda dapat mengubah warna, font, ukuran, tata letak, dan banyak lagi aspek visual dari elemen HTML.
Beberapa contoh penggunaan CSS:
- Menentukan warna latar belakang:
background-color: #f0f0f0; - Mengatur ukuran font:
font-size: 16px; - Menentukan margin dan padding:
margin: 10px; padding: 20px; - Membuat layout dengan float dan grid:
float: left; display: grid;
Bagaimana HTML dan CSS Bekerja Bersama?
HTML menyediakan struktur konten, sementara CSS mengontrol bagaimana struktur tersebut ditampilkan. Dengan kata lain, HTML menentukan apa yang ada di halaman web, sementara CSS menentukan bagaimana tampilannya.
Contoh sederhana:
Contoh HTML dan CSS
Selamat Datang!
Kode di atas mendefinisikan sebuah halaman web dengan latar belakang abu-abu, font Arial, dan judul "Selamat Datang!" yang berwarna hitam dan berada di tengah halaman.
Pentingnya Mempelajari HTML dan CSS
Mempelajari HTML dan CSS adalah langkah pertama untuk membangun sebuah website. Dengan menguasai kedua bahasa ini, Anda dapat merancang dan mengembangkan website yang menarik dan profesional.