Lề W3.CSS
Lớp w3-margin thêm lề 16px cho tất cả các cạnh của phần tử.
Các lớp ký quỹ W3.CSS
W3.CSS cung cấp các lớp ký quỹ sau:
Lớp học | Xác định |
---|---|
w3-margin | Thêm lề 16px vào tất cả các mặt của phần tử |
w3-margin-top | Thêm lề trên cùng 16px vào một phần tử |
w3-margin-right | Thêm lề phải 16px vào một phần tử |
w3-margin-bottom | Thêm lề dưới 16px vào một phần tử |
w3-margin-left | Thêm lề trái 16px vào một phần tử |
phần w3 | Thêm lề trên và dưới 16px vào một phần tử |
Lề
Lớp w3-margin thêm lề 16px cho tất cả các cạnh của phần tử:
Lớp w3-margin thêm lề 16px cho tất cả các cạnh của phần tử.
Thí dụ
<div class="w3-container w3-margin">
<p>I have 16px margin on all sides.</p>
</div>
Ký quỹ trên cùng
Lớp w3-margin-top thêm lề trên 16px vào một phần tử:
Lớp w3-margin-top thêm lề trên 16px cho một phần tử.
Thí dụ
<div class="w3-container w3-margin-top">
<p>I have 16px margin on the top.</p>
</div>
Ký quỹ dưới cùng
Lớp w3-margin-bottom thêm lề dưới 16px vào một phần tử:
Lớp w3-margin-bottom thêm lề dưới 16px vào một phần tử.
Thí dụ
<div class="w3-container w3-margin-bottom">
<p>I have 16px margin on the bottom.</p>
</div>
Lề trái
Lớp w3-margin-left thêm lề trái 16px vào một phần tử:
Lớp w3-margin-left thêm lề trái 16px cho một phần tử.
Thí dụ
<div class="w3-container w3-margin-left">
<p>I have 16px margin the left.</p>
</div>
Ký quỹ bên phải
Lớp w3-margin-right thêm lề phải 16px vào một phần tử:
Lớp w3-margin-right thêm lề phải 16px cho một phần tử.
Thí dụ
<div class="w3-container w3-margin-right">
<p>I have 16px margin the right.</p>
</div>
Phần
Nhiều phần tử HTML không có lề trên hoặc dưới mặc định. Các phần tử như vậy sẽ hiển thị mà không có khoảng cách giữa chúng:
Tôi buồn
Tôi là xanh
Lớp w3-section có thể được sử dụng để phân tách các phần tử.
Nó thêm lề trên và dưới 16px vào bất kỳ phần tử HTML nào:
Tôi buồn
Tôi là xanh
Thí dụ
<div class="w3-container w3-section w3-blue">
<h1>I am
Blue</h1>
</div>
<div class="w3-container
w3-section
w3-green">
<h1>I am Green</h1>
</div>