Các đặc tính, phương thức bố cục trang (phần 5)

Làm trôi (floating) nội dung page

Theo mặc định, nội dung được hiển thị trong trang theo trật tự nó xuất hiện trong file HTML như một
phần của dòng tài liệu thông thường. Làm trôi (floating) một phần tử lấy nó ra khỏi vị trí và đặt nó
suốt dọc lề trái hay phải của phần tử cha của nó. Nội dung tiếp theo cái không được làm trôi chiếm không
gian bị chiếm trước đó bởi phần tử được làm cho trôi. Ảnh dưới thể hiện một hình họa của một phần tử
cái được làm cho trôi suốt dọc lề phải của cái chứa của nó và hiệu ứng của nó trên vị trí đặt
của nội dung tiếp theo.

float

Để làm trôi một phần tử, áp dụng đặc tính float sau:

float:position;

nơi position là none (theo mặc định), left để làm trôi đối tượng trên lề trái, hay right để làm trôi đối
tượng trên lề phải. Nếu các phần tử anh em được làm cho trôi cùng lề, chúng được đặt cạnh lẫn nhau trong
một dòng như được thể hiện ở ảnh dưới.

in same row

 

Chú ý rằng cho các phần tử sẽ được đặt trong một dòng đơn, độ rộng kết hợp của các phần tử không vượt quá
tổng độ rộng của phần tử cha của chúng, nếu không bất cứ nội dung vượt quá nào sẽ tự động đi đến dòng mới.

Chia sẻ

Leave a Reply

Your email address will not be published. Required fields are marked *