<dfn>: The Definition element
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Phần tử <dfn> trong HTML chỉ ra một thuật ngữ cần được định nghĩa. Phần tử <dfn> nên được sử dụng trong một câu định nghĩa hoàn chỉnh, nơi định nghĩa đầy đủ của thuật ngữ có thể là một trong những điều sau:
Try it
<p>
A <dfn id="def-validator">validator</dfn> is a program that checks for syntax
errors in code or documents.
</p>
dfn {
/* Add your styles here */
}
Thuộc tính
Các thuộc tính của phần tử này bao gồm các thuộc tính toàn cục.
Thuộc tính title có ý nghĩa đặc biệt, như được ghi chú bên dưới.
Ghi chú sử dụng
Có một số khía cạnh không hoàn toàn rõ ràng khi sử dụng phần tử <dfn>. Chúng tôi xem xét những điều đó ở đây.
Chỉ định thuật ngữ đang được định nghĩa
Thuật ngữ đang được định nghĩa được xác định theo các quy tắc sau:
- Nếu phần tử
<dfn>có thuộc tínhtitle, giá trị của thuộc tínhtitleđược coi là thuật ngữ đang được định nghĩa. Phần tử vẫn phải có văn bản bên trong, nhưng văn bản đó có thể là chữ viết tắt (có thể sử dụng<abbr>) hoặc dạng khác của thuật ngữ. - Nếu
<dfn>chứa một phần tử con duy nhất và không có nội dung văn bản riêng, và phần tử con là một phần tử<abbr>có thuộc tínhtitleriêng, thì giá trị chính xác củatitlecủa phần tử<abbr>là thuật ngữ đang được định nghĩa. - Nếu không, nội dung văn bản của phần tử
<dfn>là thuật ngữ đang được định nghĩa. Điều này được hiển thị trong ví dụ đầu tiên bên dưới.
Note:
Nếu phần tử <dfn> có thuộc tính title, nó phải chứa thuật ngữ đang được định nghĩa và không có văn bản nào khác.
Liên kết đến các phần tử <dfn>
Nếu bạn bao gồm thuộc tính id trên phần tử <dfn>, bạn có thể liên kết đến nó bằng cách sử dụng các phần tử <a>. Các liên kết như vậy nên là các cách sử dụng của thuật ngữ, với ý định là người đọc có thể nhanh chóng điều hướng đến định nghĩa của thuật ngữ nếu họ chưa biết về nó, bằng cách nhấp vào liên kết của thuật ngữ.
Điều này được hiển thị trong ví dụ dưới đây về Liên kết đến các định nghĩa.
Ví dụ
Hãy xem một số ví dụ về các tình huống sử dụng khác nhau.
Xác định cơ bản một thuật ngữ
Ví dụ này sử dụng một phần tử <dfn> thuần túy để xác định vị trí của thuật ngữ trong định nghĩa.
HTML
<p>
The <strong>HTML Definition element (<dfn><dfn></dfn>)</strong> is used
to indicate the term being defined within the context of a definition phrase
or sentence.
</p>
Vì phần tử <dfn> không có title, nội dung văn bản của phần tử <dfn> được sử dụng làm thuật ngữ đang được định nghĩa.
Kết quả
Liên kết đến định nghĩa
Để thêm liên kết đến định nghĩa, bạn tạo liên kết theo cách thông thường, với phần tử <a>.
HTML
<p>
The
<strong>HTML Definition element (<dfn id="definition-dfn"><dfn></dfn>)</strong>
is used to indicate the term being defined within the context of a definition
phrase or sentence.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Graece donan, Latine
voluptatem vocant. Confecta res esset. Duo Reges: constructio interrete.
Scrupulum, inquam, abeunti;
</p>
<p>
Because of all of that, we decided to use the
<code><a href="#definition-dfn"><dfn></a></code> element for this
project.
</p>
Ở đây chúng ta thấy định nghĩa — bây giờ với thuộc tính id, "definition-dfn", có thể được sử dụng làm mục tiêu của một liên kết. Sau đó, một liên kết được tạo bằng <a> với thuộc tính href được đặt thành "#definition-dfn" để thiết lập liên kết trở lại định nghĩa.
Kết quả
Sử dụng chữ viết tắt và định nghĩa cùng nhau
Trong một số trường hợp, bạn có thể muốn sử dụng chữ viết tắt cho một thuật ngữ khi định nghĩa nó. Điều này có thể được thực hiện bằng cách sử dụng các phần tử <dfn> và <abbr> kết hợp, như thế này:
HTML
<p>
The <dfn><abbr title="Hubble Space Telescope">HST</abbr></dfn> is among the
most productive scientific instruments ever constructed. It has been in orbit
for over 20 years, scanning the sky and returning data and photographs of
unprecedented quality and detail.
</p>
<p>
Indeed, the <abbr title="Hubble Space Telescope">HST</abbr> has arguably done
more to advance science than any device ever built.
</p>
Lưu ý phần tử <abbr> được lồng bên trong <dfn>. Phần tử trước xác định rằng thuật ngữ là chữ viết tắt ("HST") và chỉ định thuật ngữ đầy đủ ("Hubble Space Telescope") trong thuộc tính title của nó. Phần tử sau chỉ ra rằng thuật ngữ viết tắt đại diện cho một thuật ngữ đang được định nghĩa.
Kết quả
Tóm tắt kỹ thuật
| Danh mục nội dung | Nội dung luồng, nội dung cụm từ, nội dung hữu hình. |
|---|---|
| Nội dung được phép |
Nội dung cụm từ,
nhưng không có phần tử <dfn> nào được là phần tử con.
|
| Bỏ qua thẻ | Không có, cả thẻ mở và thẻ đóng đều bắt buộc. |
| Phần tử cha được phép | Bất kỳ phần tử nào chấp nhận nội dung cụm từ. |
| Vai trò ARIA ngầm định | term |
| Các vai trò ARIA được phép | Bất kỳ |
| Giao diện DOM | HTMLElement |
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| HTML # the-dfn-element |