Belajar CSS dari Nol: Panduan Dasar #3 - Memahami Box Model

 

Box Model adalah konsep penting dalam CSS yang membantu Anda memahami bagaimana elemen HTML dalam halaman web Anda terorganisir. Box Model menjelaskan bagaimana elemen HTML dibungkus oleh margin, border, padding, dan elemen itu sendiri.

Margin adalah jarak luar elemen dari elemen lain. Border adalah garis tepi yang mengelilingi elemen. Padding adalah jarak dalam elemen dari elemen lain. Dan elemen itu sendiri adalah isi dari elemen HTML.

Berikut adalah contoh visual dari Box Model:

Apa itu box model pada CSS 

 

Dengan memahami Box Model, Anda dapat mengontrol jarak antar elemen dan membuat halaman web yang terorganisir dan indah. Anda dapat mengatur margin, border, dan padding dengan menggunakan properti CSS seperti margin, border, dan padding.

Contoh:

 

p {
    margin: 20px;
    border: 2px solid black;
    padding: 10px;
}
 

Itulah beberapa hal dasar tentang Box Model dalam CSS. Jangan ragu untuk mempelajari lebih lanjut tentang hal ini dan bagaimana Anda dapat menggunakannya untuk membuat halaman web yang indah dan terorganisir.

 

Posting Komentar

0 Komentar