Nổi trên trợ giúp trong HTML

Khi tạo các trang Web cho doanh nghiệp của bạn bằng mã HTML và CSS đơn giản, bạn có thể sử dụng CSS để định kiểu và định dạng các "bộ phận" cụ thể trong nội dung của mình - được xác định trong mã HTML - cho phép bạn định dạng văn bản và hình ảnh theo cách như vậy rằng họ "quấn quanh" hoặc phù hợp với nhau. Nói cách khác, các phần trong nội dung của bạn có thể điều chỉnh thành các phần khác, được sắp xếp theo cách sao cho hình ảnh và văn bản có thể khớp với nhau dưới dạng cột, lưới hoặc bất kỳ căn chỉnh cụ thể nào khác.

HTML và CSS

Mặc dù HTML trình bày một ngôn ngữ meta được gắn thẻ xác định cách một trang Web sẽ xuất hiện trong trình duyệt Web, nhưng sức mạnh thực sự của thiết kế Web sẽ đến khi bạn kết hợp HTML với Cascading Style Sheets. CSS xác định các hành vi cho các thành phần được nhúng trong tệp HTML, tạo bố cục chung cho trang. Nhiều tài liệu HTML có thể tham chiếu đến cùng một trang CSS, có nghĩa là bạn có thể thực thi giao diện thường xuyên trong tất cả các trang của mình.

Phân chia và nổi HTML

CSS hoạt động với HTML bằng cách xác định hành vi của các thẻ HTML. Cụ thể, CSS tận dụng các thẻ "". Các thẻ phân chia này bao quanh một phần của tài liệu và xác định nó là một đơn vị thông tin riêng biệt có cùng kiểu dáng trong suốt. Các bộ phận này cũng hoạt động như các "hộp" sắp xếp, thông qua CSS, bạn có thể có các phần thay đổi màu sắc nội dung, thay đổi kích thước hoặc "thả nổi" đến một ranh giới trang cụ thể để thay đổi kích thước trang không làm hỏng bố cục.

Nổi trong CSS và HTML

Để sử dụng thuộc tính "float", bạn tạo một bộ phận trong nội dung của bạn hoặc tham khảo một hình ảnh. Trong tài liệu CSS của bạn, sau đó bạn tham chiếu div hoặc hình ảnh đó theo tên và đặt cho nó một thuộc tính float. Ví dụ mã sau đây cho thấy cách thực hiện điều này với một biểu định kiểu nội bộ. Lưu ý rằng phân chia trong HTML, được đặt tên là "phần 1", có chiều rộng 100 pixel. Tất cả các bộ phận sử dụng float yêu cầu một chiều rộng được chỉ định. Hình ảnh đã có chiều rộng ngụ ý:

Xóa, lề và đệm

Cùng với những điều cơ bản khi sử dụng thuộc tính float, bạn cũng có thể sử dụng các mục khác, chẳng hạn như các thuộc tính rõ ràng, lề và phần đệm. Thuộc tính rõ ràng đảm bảo rằng không có nội dung nào khác xuất hiện trên cùng một dòng với phần tử nổi. Các lề kiểm soát không gian xung quanh các không gian bên trái và dưới cùng của bộ phận. Đệm kiểm soát không gian bên trong trong phân chia giữa nội dung và biên giới của phân chia. Ba mục này cùng nhau có thể tạo ra các phân chia "hình hộp" sạch sẽ cho phép hoặc không cho phép văn bản và hình ảnh khác bao quanh chúng.