Cách sử dụng Float và Clear

Over 0 working discount & coupon codes is active for 61 users, enjoy!

Cách sử dụng Float và Clear

Float: có thể được hiển thị ở bên trái hay bên phải của thành phần mẹ, cho phép các thành phần khác di chuyển lên lấp đầy khoảng trống nếu có.
Float thường được sử dụng để căn chỉnh hình ảnh, nhưng nó cũng được sử dụng nhiều trong thiết kế giao diện (layout). Sau đây là cách sử dụng Float và Clear

Các giá trị của Float
+ Left: Cố định phần tử về bên trái.
+ Right: Cố định phần tử về bên phải.
+ None: Không thay đổi . (Khi không được khai báo thì giá trị float bằng none).

Ví dụ: Sử dụng Float như sau:

–         Trong file: bai1html.html ta gõ như sau:

–         Trong file: style.css ta định dạng như sau:

 –    Kết quả:

Float

 

Clear: Clear luôn đi cùng với float. Có thể coi clear là ngược lại của float. Khi float thì các thành phần bên dưới di chuyển nên trên để lấp đầy khoảng trống. Nhưng không phải lúc nào chúng ta cũng muốn như vậy, do đó ta sử dụng clear để ngăn không cho các thành phần phía dưới tràn lên trên. Bạn cứ hình dung rằng khi một thành phần nào đó được gán thuộc tính clear thì nó sẽ giống như một bức tường ngăn các thành phần bên dưới di chuyển lên trên.

Các giá trị của Clear:

Clear có 4 giá trị sau: left, right, both và none.

–         Trong file: bai1html.html ta gõ như sau:

–         Trong file: style.css ta định dạng như sau:

 

–         Kết quả:

Clear

 

It's only fair to share...Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn

No Comments

Leave Comment

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">


*