Thẻ HR được sử dụng trong tài liệu web để hiển thị đường ngang trên trang hoặc đôi khi được gọi là quy tắc ngang. Không giống như một số thẻ, thẻ này không cần thẻ đóng, vì vậy tất cả những gì bạn phải làm là nhập để chèn dòng.
Dòng này trải dài trên toàn bộ chiều rộng của trang và mang theo một số thuộc tính mặc định để mô tả độ dày, vị trí và màu của đường kẻ, nhưng bạn có thể thay đổi các cài đặt đó nếu muốn.
Bạn có thể chỉnh sửa các đặc tính của dòng ngang trong tài liệu HTML5 bằng cách chỉnh sửa CSS của trang. Các dòng ngang HTML4 đã được thay đổi ở phía HTML của tài liệu.
Liệu ngữ nghĩa của thẻ nhân sự có phải không?
Trong HTML4, thẻ nhân sự không phải là ngữ nghĩa. Các phần tử ngữ nghĩa mô tả ý nghĩa của chúng về mặt trình duyệt và nhà phát triển có thể dễ dàng hiểu được. Thẻ HR chỉ là một cách để thêm một dòng đơn giản vào tài liệu ở bất cứ đâu bạn muốn. Chỉ tạo đường viền trên cùng hoặc dưới cùng của phần tử mà bạn muốn dòng xuất hiện đặt một đường ngang ở đầu hoặc cuối phần tử, nhưng nói chung, thẻ nhân sự dễ sử dụng hơn cho mục đích này.
Bắt đầu với HTML5, thẻ HR trở thành ngữ nghĩa, và bây giờ nó định nghĩa một ngắt đoạn chuyên đề theo cấp độ, là sự phá vỡ trong luồng nội dung không đảm bảo một trang mới hoặc dấu phân cách mạnh mẽ hơn - đó là sự thay đổi chủ đề. Ví dụ: bạn có thể tìm thấy thẻ nhân sự sau khi một cảnh thay đổi trong một câu chuyện hoặc có thể cho biết sự thay đổi chủ đề trong tài liệu tham chiếu.
Nhân sự thuộc tính trong HTML4 và HTML5
Trong HTML4, thẻ HR có thể được gán các thuộc tính đơn giản bao gồm căn chỉnh, chiều rộng, và không có bóng râm . Căn chỉnh có thể được đặt thành trái , trung tâm , đúng hoặc là biện minh . Chiều rộng điều chỉnh chiều rộng của đường ngang từ 100% mặc định kéo dài dòng trên trang. Các không có bóng râm thuộc tính biểu thị một đường màu liền thay vì một màu tô bóng.
Các thuộc tính này đã lỗi thời trong HTML5. Thay vào đó, bạn nên sử dụng CSS để tạo kiểu thẻ HR trong tài liệu HTML5.
Đây là một ví dụ về cách tạo kiểu dòng ngang của HTML5 với chiều cao 10 pixel bằng cách sử dụng CSS nội tuyến (các kiểu được chèn trực tiếp vào tài liệu cùng với HTML):
Một cách khác để tạo kiểu đường ngang trong HTML5 là sử dụng tệp CSS riêng biệt và liên kết đến nó từ tài liệu HTML. Trong tệp CSS, bạn sẽ viết kiểu dáng như sau: hr {chiều cao: 10px}
Hiệu ứng tương tự trong HTML4 yêu cầu bạn thêm thuộc tính vào nội dung HTML. Dưới đây là cách thay đổi kích thước của đường ngang bằng kích thước thuộc tính:
Có nhiều sự tự do hơn trong việc tạo kiểu đường ngang trong CSS so với HTML. Chỉ chiều rộng và Chiều cao phong cách nhất quán trên tất cả các trình duyệt, do đó, một số thử nghiệm và lỗi có thể cần thiết khi sử dụng các kiểu khác. Chiều rộng mặc định luôn là 100 phần trăm chiều rộng của trang web hoặc phần tử gốc. Chiều cao mặc định của quy tắc là hai pixel.
