Html Css Javascript

4 min read Jun 22, 2024
Html Css Javascript

HTML, CSS, dan JavaScript: Trifecta untuk Membangun Situs Web

HTML, CSS, dan JavaScript adalah tiga bahasa pemrograman inti yang membentuk tulang punggung pengembangan web modern. Ketiga bahasa ini bekerja bersama untuk menciptakan situs web yang interaktif dan menarik.

HTML: Struktur dan Konten

HTML (HyperText Markup Language) adalah bahasa yang digunakan untuk membangun struktur dan konten dasar situs web. HTML menggunakan tag-tag untuk menentukan elemen-elemen seperti judul, paragraf, gambar, dan link. Tag-tag ini memberi tahu browser web cara menampilkan konten di layar.

Contoh HTML:




  Judul Halaman


  

Ini adalah judul

Ini adalah paragraf.

Kode HTML di atas menghasilkan halaman web sederhana dengan judul "Judul Halaman" dan satu paragraf teks.

CSS: Gaya dan Tata Letak

CSS (Cascading Style Sheets) digunakan untuk menentukan gaya tampilan halaman web, seperti warna, font, tata letak, dan animasi. Dengan CSS, Anda dapat membuat situs web yang terlihat menarik dan profesional.

Contoh CSS:

h1 {
  color: blue;
  font-size: 3em;
  text-align: center;
}

p {
  font-family: Arial, sans-serif;
}

Kode CSS di atas mengatur warna judul menjadi biru, ukuran font menjadi 3em, dan memusatkan teks. Kode juga mengatur font paragraf menjadi Arial atau sans-serif lainnya.

JavaScript: Interaktivitas dan Fungsionalitas

JavaScript adalah bahasa pemrograman yang memungkinkan Anda untuk menambahkan interaktivitas dan fungsionalitas ke situs web. Dengan JavaScript, Anda dapat membuat elemen situs web bereaksi terhadap tindakan pengguna, memvalidasi formulir, dan membuat animasi yang dinamis.

Contoh JavaScript:

const button = document.querySelector('button');

button.addEventListener('click', () => {
  alert('Tombol diklik!');
});

Kode JavaScript di atas mengambil elemen tombol di halaman dan menambahkan event listener. Ketika tombol diklik, akan muncul alert "Tombol diklik!".

Hubungan antara HTML, CSS, dan JavaScript

Ketiga bahasa ini bekerja bersama untuk menciptakan situs web yang lengkap. HTML menyediakan struktur dan konten, CSS menentukan gaya tampilan, dan JavaScript menambahkan interaktivitas.

  • HTML adalah fondasi situs web, seperti kerangka bangunan.
  • CSS adalah lapisan atas yang menambahkan gaya dan tampilan yang menarik, seperti cat dan dekorasi.
  • JavaScript adalah lapisan paling luar yang menambahkan interaktivitas dan fungsionalitas, seperti furnitur dan peralatan.

Dengan memahami dan menguasai ketiga bahasa ini, Anda dapat membangun situs web yang menarik, interaktif, dan fungsional.