Posts
Bootstrap
- Get link
- X
- Other Apps
link : Klik disini! CSS: /* style.css */ body , html { margin: 0 ; padding: 0 ; width: 100% ; height: 100% ; } .container-fluid { padding: 0 ; /* Pastikan tidak ada padding di container-fluid */ } img { width: 100% ; height: 100px ; object-fit: cover; } @media (max-width: 576px ) { .responsive-img { height: 200px ; object-fit: cover; } } index.html: <! DOCTYPE html > < html lang = "en" > < head > < meta charset = "UTF-8" /> < meta name = "viewport" content = "width=device-width, initial-scale=1.0" /> < title >Login Page</ title > < link href = "https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel = "...
ETS pemrograman web
- Get link
- X
- Other Apps
1. Apa itu responsie web design dan sebutkan dua teknik yang sering digunakan untuk menapainya? Responsive web design adalah pendekatan dalam pembuatan website yang bertujuan agar tampilan dan fungsi situs dapat menyesuaikan dengan berbagai ukuran layar dan perangkat, seperti smartphone, tablet, dan desktop. Ini memastikan pengalaman pengguna yang konsisten dan optimal, terlepas dari perangkat yang digunakan. Dua teknik yang sering digunakan untuk mencapai responsive web design adalah: Media Queries : Ini adalah aturan CSS yang memungkinkan pengembang untuk menerapkan gaya yang berbeda berdasarkan karakteristik perangkat, seperti lebar layar, tinggi, dan resolusi. Dengan media queries, desainer dapat mengubah tata letak, ukuran font, dan elemen lainnya agar sesuai dengan ukuran layar. Flexible Grid Layouts : Ini melibatkan penggunaan grid yang fleksibel, di mana elemen-elemen pada halaman web diatur dalam kolom dan baris yang dapat menyesuaikan proporsinya berdasarkan ukuran laya...