Tạo các phần thiết kế trên trang của bạn
Tiêu đề là một cách hữu ích để tổ chức văn bản của bạn, tạo các bộ phận hữu ích và tối ưu hóa trang web của bạn cho các công cụ tìm kiếm. Bạn có thể dễ dàng tạo các tiêu đề bằng cách sử dụng các thẻ tiêu đề HTML. Bạn cũng có thể thay đổi giao diện của văn bản bằng các thẻ in đậm và in nghiêng.
Tiêu đề
Các thẻ tiêu đề là cách đơn giản nhất để chia tài liệu của bạn. Nếu bạn nghĩ trang web của mình là một tờ báo thì các tiêu đề là các tiêu đề trên báo. Dòng tiêu đề chính là h1 và các tiêu đề tiếp theo là từ h2 đến h6.
Sử dụng các mã sau để tạo HTML.
Đây là Tiêu đề 1 Đây là Tiêu đề 2 Đây là Tiêu đề 3 Đây là Tiêu đề 4 Đây là Tiêu đề 5 Đây là tiêu đề 6 Mẹo để ghi nhớ
- Cố giữ tiêu đề của bạn theo thứ tự logic, h1 đến trước h2, xuất hiện trước h3, v.v.
- Đừng lo lắng quá nhiều về các tiêu đề trông như thế nào — bạn nên sử dụng CSS để tạo kiểu cho tiêu đề thay vì sử dụng dòng tiêu đề không đúng thứ tự.
- Các thẻ tiêu đề là các phần tử mức khối , do đó chúng đặt vào các ngắt dòng cho bạn. Không đặt thẻ P bên trong thẻ tiêu đề.
Đậm và nghiêng
Đây là Tiêu đề 3 Đây là Tiêu đề 4 Đây là Tiêu đề 5 Đây là tiêu đề 6 Mẹo để ghi nhớ
- Cố giữ tiêu đề của bạn theo thứ tự logic, h1 đến trước h2, xuất hiện trước h3, v.v.
- Đừng lo lắng quá nhiều về các tiêu đề trông như thế nào — bạn nên sử dụng CSS để tạo kiểu cho tiêu đề thay vì sử dụng dòng tiêu đề không đúng thứ tự.
- Các thẻ tiêu đề là các phần tử mức khối , do đó chúng đặt vào các ngắt dòng cho bạn. Không đặt thẻ P bên trong thẻ tiêu đề.
Đậm và nghiêng
Đây là Tiêu đề 5 Đây là tiêu đề 6 Mẹo để ghi nhớ
- Cố giữ tiêu đề của bạn theo thứ tự logic, h1 đến trước h2, xuất hiện trước h3, v.v.
- Đừng lo lắng quá nhiều về các tiêu đề trông như thế nào — bạn nên sử dụng CSS để tạo kiểu cho tiêu đề thay vì sử dụng dòng tiêu đề không đúng thứ tự.
- Các thẻ tiêu đề là các phần tử mức khối , do đó chúng đặt vào các ngắt dòng cho bạn. Không đặt thẻ P bên trong thẻ tiêu đề.
Đậm và nghiêng
Mẹo để ghi nhớ
- Cố giữ tiêu đề của bạn theo thứ tự logic, h1 đến trước h2, xuất hiện trước h3, v.v.
- Đừng lo lắng quá nhiều về các tiêu đề trông như thế nào — bạn nên sử dụng CSS để tạo kiểu cho tiêu đề thay vì sử dụng dòng tiêu đề không đúng thứ tự.
- Các thẻ tiêu đề là các phần tử mức khối , do đó chúng đặt vào các ngắt dòng cho bạn. Không đặt thẻ P bên trong thẻ tiêu đề.
Đậm và nghiêng
Có bốn thẻ bạn có thể sử dụng cho chữ đậm và in nghiêng:
- và để in đậm
- và để in nghiêng
Nó không quan trọng mà bạn sử dụng. Mặc dù một số người thích và hơn, nhưng nhiều người tìm thấy "đậm" và in nghiêng dễ nhớ hơn.
Chỉ cần bao quanh văn bản của bạn với các thẻ mở và đóng, để làm cho văn bản in đậm hoặc in nghiêng:
in đậm nghiêngBạn có thể lồng các thẻ này (có nghĩa là bạn có thể tạo văn bản cả in đậm và in nghiêng) và không quan trọng đó là thẻ bên ngoài hoặc thẻ bên trong.
Ví dụ:
Văn bản này được in đậm
Văn bản này được in đậmVăn bản này in nghiêng
Văn bản này là chữ nghiêngVăn bản này là chữ in đậm và in nghiêng
Văn bản này vừa đậm vừa in nghiêngTại sao có hai bộ thẻ in đậm và in nghiêng
Trong HTML4, các thẻ và được coi là thẻ kiểu chỉ ảnh hưởng đến giao diện văn bản và không nói gì về nội dung của thẻ và nó được coi là biểu mẫu xấu để sử dụng chúng. Sau đó, với HTML5, chúng được đưa ra một ý nghĩa ngữ nghĩa bên ngoài giao diện của văn bản.
Trong HTML5, các thẻ này có ý nghĩa cụ thể:
- biểu thị văn bản không quan trọng hơn văn bản xung quanh, nhưng bản trình bày typographic điển hình là văn bản in đậm, chẳng hạn như từ khóa trong tóm tắt tài liệu hoặc tên sản phẩm trong bài đánh giá.
- biểu thị văn bản không quan trọng hơn văn bản xung quanh, nhưng bản trình bày typographic điển hình là văn bản in nghiêng, chẳng hạn như tiêu đề sách, thuật ngữ kỹ thuật hoặc cụm từ bằng ngôn ngữ khác.
- biểu thị văn bản có tầm quan trọng mạnh mẽ so với văn bản xung quanh.
- biểu thị văn bản có căng thẳng nhấn mạnh so với văn bản xung quanh.