Gốc > Những vấn đề về CNTT > Web > CSS >
Đỗ Thanh Dương @ 16:28 19/03/2011
Số lượt xem: 387
Bài 9: Box Model
Trong CSS, box model (mô hình hộp) mô tả cách mà CSS định dạng khối không
gian bao quanh một thành phần. Nó bao gồm padding (vùng đệm), border (viền) và
margin (canh lề) và các tùy chọn. Hình bên dưới mô tả cấu trúc minh họa mô hình
hộp cho một thành phần web.
<p> Trong CSS, box model (mô hình hộp) mô tả cách mà CSS định dạng khối không
gian bao quanh một thành phần. </p>
Phần CSS cho đoạn HTML trên:
Với ví dụ trên chúng ta sẽ khái quát được mô hình hộp như sau:
Có lẽ bạn sẽ cảm thấy hơi khó hiểu. Nhưng không sao cả, tạm thời bạn cứ chấp
nhận như vậy. Còn về những “cái hộp” này thì chúng ta sẽ cùng tìm hiểu cụ thể
hơn trong các bài học tiếp theo.
gian bao quanh một thành phần. Nó bao gồm padding (vùng đệm), border (viền) và
margin (canh lề) và các tùy chọn. Hình bên dưới mô tả cấu trúc minh họa mô hình
hộp cho một thành phần web.
 |
Hình ảnh này đã bị thay đổi kích thước nhằm tránh làm vỡ giao diện. Bấm vào đây để xem ảnh ở kích thước đầy đủ ( 620x315 ) |
<p> Trong CSS, box model (mô hình hộp) mô tả cách mà CSS định dạng khối không
gian bao quanh một thành phần. </p>
Phần CSS cho đoạn HTML trên:
HTML Code:
p {
width:200px;
margin:30px 20px;
padding:20px 10px;
border:1px solid #000;
text-align:justify
}
Có lẽ bạn sẽ cảm thấy hơi khó hiểu. Nhưng không sao cả, tạm thời bạn cứ chấp
nhận như vậy. Còn về những “cái hộp” này thì chúng ta sẽ cùng tìm hiểu cụ thể
hơn trong các bài học tiếp theo.
Đỗ Thanh Dương @ 16:28 19/03/2011
Số lượt xem: 387
Số lượt thích:
0 người
- Bài 8: Span & Div (19/03/11)
- Bài 7 : Class & ID (19/03/11)
- Bài 6: Pseudo-classes For Links (19/03/11)
- Bài 5: Text (19/03/11)
- Bài 4: Font Chữ (19/03/11)
Ý kiến trao đổi