RSSCSS

Float & Clear - Position, Overflow trong CSS

Float & ClearFloat (theo như nghĩa tiếng Việt là thả trôi) là một thuộc tính CSS dùng để cố định một thành phần web về bên trái hay bên phải không gian bao quanh nó. Đây là một thuộc tính rất cần thiết khi dàn trang (như tạo các trang web 2 column layout hay 3 column layout).

1.2.10 Float & Clear
Float (theo như nghĩa tiếng Việt là thả trôi) là một thuộc tính CSS dùng để cố định một thành phần web về bên trái hay bên phải không gian bao quanh nó. Đây là một thuộc tính rất cần thiết khi dàn trang (như tạo các trang web 2 column layout hay 3 column layout).

Float còn giúp hiển thị văn bản thành cột (giống như kiểu Format  Columns trong MS Word vậy), hay thực hiện việc định vị trí ảnh và text (như một số kiểu text wrapping của MS Word)

1.2.11 Position, Overflow

Position của phần tử là kiến thức rất quan trọng cần thiết phải biết nếu bạn muốn tạo các hiệu ứng trên trang bằng cách sử dụng javascript.
Đầu tiên, CSS nhìn khung trình duyệt như một hệ trục tọa độ 3 chiều với
 Gốc tọa độ nằm ở góc trên trái khung trình duyệt
 Trục Oy có chiều từ trễn xuống dưới
 Trục Ox có chiều từ trái sang phải
 Trục Oz có chiều từ trong màn hình hướng ra ngoài
Sử dụng position kết hợp với các thuộc tính định vị trí, chúng ta có thể đặt một phần tử ở bất kì vị trí nào trên trang (so với khung trình duyệt) hoặc ở bất kì vị trí nào trong một phần tử khác (phần tử chứa nó).

Position có thể được thiết lập một trong 3 giá trị gồm:
 absolute
 static
 relative
Overflow nói tới cách xử sự của một phần tử với nội dung chứa trong nó. Ví dụ bạn có một thẻ div có độ rộng và chiều cao là 400px. Tuy nhiên nội dung chứa bên trong thẻ div đó rất nhiều. Mặc định phần chứa bên trong sẽ tràn ra bên ngoài, tuy nhiên ta có thể thiết lập để ẩn phần "thừa ra" của nội dung hoặc cho xuất hiện các thanh cuộn bên phải và ở dưới thẻ div để cuộn xem nội dung.

 

Tags:

Nếu bạn thấy bài viết hữu ích, hãy nhấn +1 và các liên kết chia sẻ để website ngày càng phát triển hơn. Xin cám ơn bạn!

Nếu là khách, bạn phải đăng ký tài khoản và kích hoạt tài khoản để bình luận được hiển thị ở đây.
Thông tin kích hoạt gửi đến mail của bạn.

Tin mới hơn

Tin cũ hơn

Lên trên đầu