Pemrograman
Pengenalan HTML dan CSS
1.Pengenalan HTML dan CSS
HTML (HyperText Markup Language) adalah bahasa markup
yang digunakan untuk membuat struktur halaman web. CSS
(Cascading Style Sheets) adalah bahasa yang digunakan
untuk mengatur tampilan dan gaya dari elemen HTML.
2. Struktur Dasar HTML
Setiap halaman HTML dimulai dengan struktur dasar
berikut:
Penjelasan:
!DOCTYPE html : Mendeklarasikan tipe
dokumen sebagai HTML5.
html : Elemen root dari dokumen
HTML.
head: Berisi metadata seperti judul
halaman, link ke file CSS, dan lainnya.
body: Berisi konten yang akan
ditampilkan di halaman web.
3. Elemen HTML Dasar
Berikut adalah beberapa elemen HTML yang umum
digunakan:
a. Heading(Judul):
b. Paragraf:
c. Tautan(Link):
d. Gambar:
e. List
List tidak berurutan (unordered list):
Daftar berurutan (ordered list):
Hampir sama seperti unorderet list, tetapi "ul" diganti
dengan "ol"
f. Tabel:
g. Formulir:
4. Pengenalan CSS
CSS digunakan untuk mengatur tampilan elemen HTML.
Berikut adalah cara menghubungkan CSS ke HTML:
a. Sintaks Dasar CSS:
Contoh:
b. Menggunakan Class dan ID
Class: Bisa digunakan untuk banyak
elemen.
ID: Hanya bisa digunakan untuk satu
elemen.
5. Layout dengan CSS
a. Flexbox
Flexbox adalah model layout yang memudahkan pengaturan
tata letak elemen.
b. CSS Grid
CSS Grid memungkinkan pembuatan layout kompleks dengan
mudah.
6. Responsive Design
Gunakan Media Queries untuk membuat
halaman web responsif di berbagai perangkat.
7. Tips dan Best Practices
1. Gunakan Elemen Semantik: Gunakan
"header", "main", "section", "article", dan "footer"
untuk struktur yang lebih baik.
2. Pisahkan HTML dan CSS: Selalu
gunakan file CSS terpisah.
3. Responsive Design: Pastikan website
Anda bisa diakses di berbagai perangkat.
4. Optimalkan Kode: Gunakan tools
seperti
Prettier untuk
memformat kode.
Sekian pengenalan HTML dan CSS Kali ini, kita akan
lanjut ke Pembelajaran HTML dan CSS Tingkat Lanjut.
Terima kasih telah membaca.
0 komentar