Halo teman – teman, Kali kami akan bahas Mengenai Widht dan Height, jadi kalau kalian telah membuat background, color tapi kalian gatau caranya membuat width dan height hmmm belum afdol rasanya. Untuk itu mari kita pelajari dengan santai tapi serius.
width : lebar
height : tinggi
Siapa tau ada yang ga tau artinya. hehe
Jadi intinya fungsi ini untuk membuat lebar dan tinggi seperti yang kita mau, oh iya mungkin bakal om bewok jelasin lagi mengenai konsep % di width dan height, mungkin kalian sering banget liat untuk panjang dan lebar menggunakan (px), nah bukan berarti ga bagus sih, tapi sekarang jamanya mulai ke mobile, Sehingga kita harus mengikuti ukuran layar semua hp agar mudah di lihat, untuk itu kita menggunakan persen %, Jadi jari kita ga cape buat geser- geser hehe. Langsung aja ya om bewok kasih contohnya
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>logo</title>
#bewok {
max-width:100%;
height:80px;
background:#1abc9c;
color:#ffffff;
}
</head>
<body>
halo lagi pada ngapain semuanya ?
</body>
</html>Maka hasilnya bisa lihat dibawah ini
 |
| Gambar 1.1 width & height menggunakan % |
Nah mungkin masih bertanya – tanya kenapa menggunakan
max-width :
max : maksimal
widht : lebar
Lebar maksimal maksudnya yang mana ketika kita sudah ketikan maksimal, berarti lebar maksimalnya hanya 100% ga bakal bisa lebih,
Tapi kalau menggunakan width saja, bisa sampai ujung jika menggunakan 100% atau menggunakan px.
Kalau px bakal nempel sama ujungnya, tapi kalau yang % tanpa menggunakan margin atau padding tidak akan sampai ujung, tapi kalau sudah di kasih margin, dan padding pasti bakal sampai ujung.
Nah bedanya dengan si max-width ini, kita kasih margin, padding tidak akan sampai ujung agar dapat mengikuti layar mobile
Itu saja TUTORIAL MENGENAI WIDTH DAN HEIGHT PADA CSS, Selanjutnya kita akan mempelajari TUTORIAL CSS PART 6 : BELAJAR BORDER PADA CSS
alfiandi.code.blog 