Halo sobat Artikel Multimedia, postingan kali ini berisi materi tentang pengenalan HTML dan CSS serta hubungan antar keduanya. Sebagian sobat mungkin sudah pernah mendengar tentang HTML ataupun CSS, bagi sobat yang belum pernah dan ingin tahu, kita akan membahas nya di sini.
HTML (HyperText Markup Language) merupakan bahasa markup yang pada dasarnya digunakan untuk membuat struktur dan konten dari sebuah halaman website. HTML berguna untuk menyusun elemen-elemen seperti judul, paragraf, gambar, tautan (link), tabel, formulir (form).
<html>
<head>
<title>Halaman Web Saya</title>
</head>
<body>
<h1>Selamat Datang!</h1>
<p>Ini adalah contoh halaman web sederhana saya.</p>
<img src="image01.jpg" alt="Contoh Gambar">
</body>
</html>
- Menentukan struktur dokumen website.
- Menyediakan kerangka untuk semua elemen website.
- Menjadi ruang bagi css untuk mengatur tampilan (styling) halaman.
Sedangkan CSS (Cascading Style
Sheets) merupakan bahasa yang digunakan untuk mengatur bentuk tampilan (style)
dari elemen-elemen HTML. CSS mengontrol aspek visual seperti warna, ukuran
tulisan (font), tata letak, marging, padding, dan border, serta animasi dan
efek transisi pada halaman website.
color: blue;
font-size: 36px;
}
p {
color: gray;
line-height: 1.5;
}
HTML dan CSS memiliki hubungan saling melengkapi satu sama lain untuk bekerja sama dalam membuat halaman website yang menarik dan terstruktur. Hubungan antar keduanya dapat diilustrasikan dengan perumpamaan HTML sebagai kerangka/tulang (struktur) dan CSS sebagai kulit/pakaian (tampilan).
<html>
<head>
<title>Contoh Integrasi HTML dan CSS</title>
<style>
body {
background-color: #f0f0f0;
font-family: Arial;
}
h1 {
color: blue;
}
</style>
</head>
<body>
<h1>Selamat Datang!</h1>
<p>Ini adalah halaman web saya.</p>
</body>
</html>
1. Inline CSS: Caranya ditambahkan langsung dalam tag HTML.
2. Internal CSS: Caranya ditambahkan di dalam tag <style> yang masih berada di dalam tag <head> seperti berikut.
p { color: blue; }
</style>
3. External CSS: Cara ini dilakukan dengan membuat file HTML dengan file CSS secara terpisah. Sehingga pada saat style dari file css ini ingin digunakan maka harus ditambahkan tag link pada HTML seperti berikut untuk memanggilnya.
Sekian penjelasan singkat mengenai HTML dan CSS, jika sobat tertarik dengan materi terkait multimedia silakan kunjungi postingan kami lainnya di blog ini. Terima kasih ...
0 Komentar
Terima kasih telah mengunjungi website ini semoga bermanfaat untuk anda