HTML CSS JAVASCRIPT SQL PYTHON PHP HOW TO W3.CSS JAVA JQUERY C++ R React
ภาษาไทย Afrikaans العربية čeština Deutsch Español Français हिन्दी Bahasa Indonesia Italiano 日本語 한국어 မြန်မာဘာသာ Nederlands Polski Português Русский Türkçe Tiếng Việt

Hướng dẫn HTML

TRANG CHỦ HTML Giới thiệu HTML Trình chỉnh sửa HTML HTML cơ bản Phần tử HTML Thuộc tính HTML Tiêu đề HTML Đoạn văn HTML Kiểu HTML Định dạng HTML Trích dẫn HTML Nhận xét HTML Màu HTML
Màu sắc RGB HEX HSL
HTML CSS Liên kết HTML
Liên kết Màu liên kết Liên kết Dấu trang
Hình ảnh HTML
Hình ảnh Bản đồ hình ảnh Hinh nên Yếu tố hình ảnh
HTML Favicon Bảng HTML
Bảng HTML Đường viền bảng Kích thước bảng Tiêu đề bảng Padding & Spacing Colspan & Rowspan Tạo kiểu bảng Bảng Colgroup
Danh sách HTML
Danh sách Danh sách không theo thứ tự Danh sách có Thứ tự Danh sách khác
Khối HTML & Nội tuyến Các lớp HTML Id HTML Khung nội tuyến HTML HTML JavaScript Đường dẫn tệp HTML Đầu HTML Bố cục HTML HTML đáp ứng Mã máy tính HTML Ngữ nghĩa HTML Hướng dẫn kiểu HTML Thực thể HTML Biểu tượng HTML Biểu tượng cảm xúc HTML Bộ mã HTML Mã hóa URL HTML HTML so với XHTML

Biểu mẫu HTML

Biểu mẫu HTML Thuộc tính biểu mẫu HTML Phần tử biểu mẫu HTML Các loại đầu vào HTML Thuộc tính đầu vào HTML Thuộc tính biểu mẫu nhập HTML

Đồ họa HTML

HTML Canvas HTML SVG

HTML Media

HTML Media Video HTML Âm thanh HTML Trình cắm HTML HTML YouTube

API HTML

Vị trí địa lý HTML Kéo / thả HTML Lưu trữ web HTML Nhân viên web HTML HTML SSE

Ví dụ HTML

Ví dụ HTML HTML Quiz Bài tập HTML Chứng chỉ HTML Tóm tắt HTML Khả năng truy cập HTML

Tham chiếu HTML

Danh sách thẻ HTML Thuộc tính HTML Thuộc tính toàn cầu HTML Hỗ trợ trình duyệt HTML Sự kiện HTML Màu HTML HTML Canvas HTML Audio / Video HTML Doctypes Bộ ký tự HTML Mã hóa URL HTML Mã HTML Lang Tin nhắn HTTP Phương thức HTTP Công cụ chuyển đổi PX sang EM Các phím tắt bàn phím

Các phần tử và kỹ thuật bố cục HTML

❮ Trước Kế tiếp ❯

Các trang web thường hiển thị nội dung trong nhiều cột (như một tạp chí hoặc một tờ báo).

Thí dụ

Cities

London

London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.

Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.

Footer

Phần tử bố cục HTML

HTML có một số phần tử ngữ nghĩa xác định các phần khác nhau của trang web:

HTML5 Semantic Elements
<header> - Defines a header for a document or a section
<nav> - Defines a set of navigation links
<section> - Defines a section in a document
<article> - Defines an independent, self-contained content
<aside> - Defines content aside from the content (like a sidebar)
<footer> - Defines a footer for a document or a section
<details> - Defines additional details that the user can open and close on demand
<summary> - Defines a heading for the <details> element
Phần tử ngữ nghĩa HTML5
  • <header> - Xác định tiêu đề cho một tài liệu hoặc một phần
  • <nav> - Xác định một tập hợp các liên kết điều hướng
  • <section> - Xác định một phần trong tài liệu
  • <article> - Xác định một nội dung độc lập, khép kín
  • <aside> - Xác định nội dung bên cạnh nội dung (như một thanh bên)
  • <footer> - Xác định chân trang cho một tài liệu hoặc một phần
  • <details> - Xác định các chi tiết bổ sung mà người dùng có thể mở và đóng theo yêu cầu
  • <summary>- Xác định tiêu đề cho <details>phần tử

Bạn có thể đọc thêm về các yếu tố ngữ nghĩa trong chương Ngữ nghĩa HTML của chúng tôi .

Kỹ thuật bố cục HTML

Có bốn kỹ thuật khác nhau để tạo bố cục nhiều cột. Mỗi kỹ thuật đều có ưu và nhược điểm của nó:

  • Khung CSS
  • Thuộc tính float CSS
  • CSS flexbox
  • Lưới CSS

Khung CSS

Nếu bạn muốn tạo bố cục của mình nhanh chóng, bạn có thể sử dụng khung CSS, như W3.CSS hoặc Bootstrap .

Bạn đã từng nghe về W3Schools Spaces ? Tại đây, bạn có thể tạo trang web của mình từ đầu hoặc sử dụng mẫu và lưu trữ miễn phí.

Bắt đầu miễn phí ❯

* Không cần thẻ tín dụng

Bố cục nổi CSS

Thông thường, thực hiện toàn bộ bố cục web bằng cách sử dụng thuộc tính CSS float. Float rất dễ học - bạn chỉ cần nhớ cách hoạt động của các thuộc tính floatvà . Nhược điểm: Các phần tử nổi bị ràng buộc với dòng tài liệu, có thể gây hại cho tính linh hoạt. Tìm hiểu thêm về float trong chương CSS Float và Clear của chúng tôi . clear

Thí dụ

Cities

London

London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.

Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.

Footer

Bố cục CSS Flexbox

Việc sử dụng flexbox đảm bảo rằng các phần tử hoạt động có thể đoán trước được khi bố cục trang phải phù hợp với các kích thước màn hình khác nhau và các thiết bị hiển thị khác nhau.

Tìm hiểu thêm về flexbox trong chương CSS Flexbox của chúng tôi .

Thí dụ

Cities

London

London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.

Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.

Footer

Bố cục lưới CSS

Mô-đun bố cục lưới CSS cung cấp một hệ thống bố cục dựa trên lưới, với các hàng và cột, giúp thiết kế các trang web dễ dàng hơn mà không cần phải sử dụng phao và định vị.

Tìm hiểu thêm về lưới CSS trong chương Giới thiệu về lưới CSS của chúng tôi.


❮ Trước Kế tiếp ❯