 |
| Thuộc tính clear trong CSS |
Thuộc tính clear là gì?
Thuộc tính clear xác định 2 bên của phần tử (left, right), nơi mà phần tử float không được cho phép (ngăn cản thành phần không được float trái, phải hay cả hai)- Cấu trúc
tag {
clear: giá trị;
}
- Thuộc tính clear có 5 giá trị đó là- left - Bên trái của thành phần không được float. VD: clear: left;
- right - Bên phải của thành phần không được float. VD: clear: right;
- both - Bên trái và phải của thành phần không được float.VD: clear: both;
- none - Đây là mặc định của thành phần clear, bên trái và phải của thành phần được float. VD: clear: none;
- inherit - Xác định thừa hưởng thuộc tính từ thành phần cha (thành phần bao ngoài). VD: clear: inherit;
<html> <head></head> <body> <p class="exFloat"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifislcvp6krUoHewRlf7eul0pkSRzAzQHkrDXyXG6CLcRICvRn32RsyBRn7DrzQk9bU6NHOXS_nA5E9GtlGXLWMLqFnA-g0GXpY5s_TLsO2AcAhuEaVRlxvjw8RvjNWXxloJRijqdz95u-/w140-h140-p/thuoc-tinh-clear.jpg" alt="softwarecrack" /></p> <p>This is a text</p> </body> </html>Ta thêm code css vào
p.exFloat {
float: left;
}
Khi thêm code trên vào ta thấy hình ảnh và đoạn text nằm trên một hàng nhưng hình ảnh ở phía bên trái so với khi chưa float.- Thuộc tính clear được hỗ trợ trong đa số các trình duyệt.
Giá trị "inherit" không hỗ trợ trình duyệt IE7 trở xuống, IE8 đòi hỏi phải có !Doctype
