HTML5: <abbr>
Tổng quan
Thẻ <abbr> (abbreviation) dùng để đánh dấu cho cụm ký tự viết tắt nào đó, chẳng hạn như HTML, CSS, JS, ...
Việc đánh dấu này sẽ giúp ích khá nhiều trong việc thân thiện hoá với trình duyệt, trình dịch cũng như bộ máy tìm kiếm (Search Engine - SE).
Lưu ý: Số loại ngữ pháp của văn bản trong thuộc tính title nên tương ứng với nội dung của thẻ <abbr>, đặc biệt là với những ngôn ngữ có nhiều hơn hai loại ngữ pháp (ví dụ như tiếng Ả Rập, ngữ pháp có cả loại đơn, loại đôi và loại bội).
Nhóm nội dung
Nội dung được phép
Thẻ đóng
Bắt buộc phải có thẻ mở <abbr> và thẻ đóng </abbr>.
Phần tử cha được phép
Bất kỳ phần tử nào chấp nhận nhóm nội dung Phrasing.
DOM interface
HTMLElement, HTMLSpanElement.
Thuộc tính
<p> bao gồm Các thuộc tính Global.
Bạn nên sử dụng thuộc tính title đi kèm để giải nghĩa chi tiết cho cụm từ viết tắt.
Kiểu mặc định
Đa số các trình duyệt đều định kiểu cho thuộc tính display của thẻ <abbr> là display:inline, và đây cũng là định kiểu tốt nhất. Vậy nên, nếu trình duyệt nào không thiết lập cách thức hiển thị này thì bạn cần chủ động đổi lại.
Một số trình duyệt như Internet Explorer lại định kiểu cho <abbr> tương tự như thẻ <span>.
Một số trình duyệt khác như FireFox, Opera lại đưa thêm dấu gạch chấm (dot) ở dưới nội dung của phần tử.
Một số ít trình duyệt lại thêm cả dấu gạch chấm và ký hiệu (tương đối nhỏ) dạng mũ (small-cap).
Nếu bạn muốn tránh những định kiểu như trên bạn nên đưa thêm CSS vào <abbr>, ví dụ như bạn có thể sử dụng thuộc tính font-varial:none.
Cũng cần lưu ý thêm nữa là các trình duyệt Internet Explorer từ phiên bản 6 trở xuống lại không hỗ trợ thẻ <abbr>; trong trường hợp này bạn cần đưa đoạn script sau vào trong thẻ <head>:
<!--[if lte IE 6]>
<script>
document.createElement("abbr");
</script>
<![endif]-->
Ví dụ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<abbr title="HyperText Markup Language">HTML</abbr> ra đời năm 1991.
</body>
</html>
Khả năng tương thích trình duyệt
Desktop
Feature |
Chrome |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
---|---|---|---|---|---|
Hỗ trợ cơ bản |
2.0 |
1.0 (1.7 or earlier) |
7.0 |
1.3 |
(Yes) |
Mobile
Feature |
Android |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
---|---|---|---|---|---|
Hỗ trợ cơ bản |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
Xem thêm
· Các phần tử truyền đạt ngữ nghĩa cấp văn bản khác: <a>, <b> & <strong>, <em>, <small>, <cite>, <q>, <dfn>, <time>, <code>, <var>, <samp>, <kbd>, <sub>, <sup>, <i>, <mark>, <ruby>, <rp>, <rt>, <bdo>, <span>, <br>, <wbr>.