Sekarang akan menambahkan beberapa kode CSS ke dalam media query kita untuk membuat halaman web responsif.
Kita dapat menggunakan properti CSS seperti margin, padding, dan font-size untuk memastikan bahwa konten kita terlihat baik di berbagai layar.
<html>
<head>
<title>Halaman Web Responsif</title>
<style>
@media (min-width: 600px) {
h1 {
margin: 0;
padding: 0;
font-size: 24px;
}
p {
margin: 0;
padding: 0;
font-size: 16px;
}
img {
width: 100%;
}
a {
font-size: 12px;
}
}
</style>
</head>
<body>
<h1>Halaman Web Responsif</h1>
<p>Ini adalah halaman web responsif yang dibuat menggunakan HTML dan CSS.</p>
<img src="gambar.jpg" alt="Gambar Responsif">
<a href="http://example.com">Kunjungi website ini</a>
</body>
</html>
Langkah 4: Uji Coba Halaman Web Anda
Sekarang kita telah menyelesaikan halaman website responsif. Kita dapat menguji halaman dengan membukanya di berbagai layar untuk memastikan bahwa halaman terlihat baik di berbagai ukuran.
Dengan mengikuti tutorial ini, Anda telah mempelajari cara membuat halaman website responsif menggunakan HTML dan CSS. Selamat dicoba!
Gabung juga di kanal Telegram dengan klik link https://t.me/networknewsupdate, kemudian join dan nantikan berita update terbaru setiap jamnya.***