Ahlan wa sahlan !

Ahlan wa sahlan...
TIKmawar adalah blog TIK untuk guru dan siswa yang ingin memahami teknologi secara logis, praktis, dan menyenangkan. Bareng Bu Mawar, kita akan belajar TIK tidak hanya klik-klik, tetapi juga memahami maksudnya .

Perbedaan Html dan Css



Ada banyak bahasa yang bisa kita gunakan untuk membuat halaman web. Tidak perlu bingung untuk memilihnya. Sebagai permulaan, kita bisa mempelajari html dan css dulu.
Apa itu html? apa itu css? perbedaannya apa?

اَلسَّلَامُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ

Halo, calon ahli digital masa depan!
Yuk, belajar bareng Bu Mawar—karena dari satu klik, bisa lahir sejuta ide dan manfaat.


HTML (HyperText Markup Language) adalah bahasa dasar untuk membuat struktur atau kerangka halaman web.
HTML bukan bahasa pemrograman, tetapi bahasa markup, artinya menggunakan tag-tag untuk memberi tahu browser bagaimana menampilkan isi halaman.

HTML berfungsi untuk:

Membuat struktur halaman web (judul, paragraf, gambar, tabel, link, form, dll).
Menampilkan teks dan media (seperti gambar atau video).
Menghubungkan antarhalaman dengan hyperlink.
Menjadi pondasi utama sebelum ditambahkan gaya (CSS) dan interaksi (JavaScript).

<!DOCTYPE html>
<html>
  <head>
    <title>Halaman Pertamaku</title>
  </head>
  <body>
    <h1>Ahlan wa sahlan!</h1>
    <p>Ini adalah halaman web pertamaku.</p>
    <img src="gambar.jpg" alt="Contoh Gambar">
  </body>
</html>

HTML memberi bentuk dan isi halaman, tapi belum memberi gaya atau warna.

CSS (Cascading Style Sheets) adalah bahasa untuk mengatur tampilan (gaya visual) dari halaman HTML.
Kalau HTML adalah tulang dan isi, maka CSS adalah pakaian dan hiasannya.

Fungsi CSS

Memberi warna, font, ukuran teks, dan layout.
Mengatur jarak antar elemen (margin, padding).
Membuat tampilan responsif agar web bagus di HP maupun laptop.
Mengatur animasi sederhana dan efek visual.

body {
  background-color: lightblue;
  font-family: Arial, sans-serif;
}

h1 {
  color: darkblue;
  text-align: center;
}

p {
  color: white;
  background-color: navy;
  padding: 10px;
  border-radius: 5px;
}

Kode ini membuat tampilan HTML jadi menarik: latar biru muda, teks rapi, dan paragraf berwarna.

Jadi, perbedaan html dan css adalah :
Aspek HTML CSS
Kepanjangan HyperText Markup Language Cascading Style Sheets
Fungsi utama Menyusun struktur & isi halaman web Mengatur tampilan & gaya halaman web
Bersifat Rangka (kerangka web) Dekorasi (hiasan web)
Contoh tag/kode <h1>, <p>, <img>, <a> color, background, font-size
Tempat penulisan Dalam file .html Dalam file .css atau di dalam tag <style>
Hubungan CSS melengkapi HTML CSS bergantung pada struktur HTML



Tidak ada komentar:

Posting Komentar