<abbr>: Element Skrótu
Element skrótu HTML (<abbr>
) reprezentuje skrót lub akronim; opcjonalny atrybut title
może stanowić rozwinięcie lub opis skrótu. Jeśli występuje, title
musi zawierać pełny opis i nic więcej.
Artykuł Jak oznaczać skróty i uczynić je zrozumiałymi jest przewodnikiem do nauki używania <abbr>
i elementów pokrewnych.
Kategorie treści | Treść płynna, Treść frazowania, zawartość zdzieralna. |
---|---|
Dozwolona zawartość | Treść frazowania |
Pominięcie znacznika | Brak, zarówno znacznik początkowy jak i końcowy są obowiązkowe. |
Dozwoleni rodzice | Każdy element, który akceptuje zawartość frazowania |
Dozwolone role ARIA | Każdy |
Interfejs DOM | HTMLElement |
Atrybuty
Ten element obsługuje tylko atrybuty globalne. Atrybut title
ma specyficzne znaczenie semantyczne, gdy jest używany z elementem <abbr>
; musi zawierać pełny opis czytelny dla człowieka lub rozwinięcie skrótu. Tekst ten jest często prezentowany przez przeglądarki jako etykieta pomocnicza, gdy kursor myszy jest zawieszony nad elementem.
Każdy element <abbr>
, którego używasz jest niezależny od wszystkich innych; podanie title
dla jednego elementu nie załącza automatycznie tego samego rozszerzenia tekstu do innych o tej samej treści.
Uwagi dotyczące użycia
Typowe zastosowania
Z pewnością nie jest wymagane, aby wszystkie skróty były oznaczane przy użyciu <abbr>
. Jest jednak kilka przypadków, w których jest to pomocne:
- Jeśli używany jest skrót i chcesz zapewnić rozszerzenie lub definicję poza obiegiem treści dokumentu, użyj
<abbr>
z odpowiednim atrybutemtitle
. - Aby zdefiniować skrót, który może być nieznany czytelnikowi, należy przedstawić termin używając
<abbr>
oraz atrybututitle
lub tekstu liniowego podającego definicję. - W przypadku, gdy należy zwrócić uwagę semantycznie na obecność skrótu w tekście, przydatny jest element
<abbr>
. To z kolei może być użyte do celów stylizacyjnych lub skryptowych. - Możesz użyć
<abbr>
w porozumieniu z<dfn>
aby ustalić definicje terminów, które są skrótami lub akronimami. Zobacz przykład Definiowanie skrótu poniżej.
Uwagi gramatyczne
W języka z grammatical number (czyli w tych językach, w których liczba elementów wpływa na gramatykę zdania), użyj tej samej liczby gramatycznej w atrybucie title
, co wewnątrz elementu <abbr>
. Jest to szczególnie ważne w językach z więcej niż dwoma liczbami, takich jak Arabski, ale jest również istotne w języku angielskim.
Domyślna stylizacja
Celem tego znacznika jest jedynie wygoda dla autora i wszystkie przeglądarki domyślnie wyświetlają go w linii (display
: inline
), choć jego stylizacja różni się w zależności od przeglądarki:
- Niektóre przeglądarki, takie jak Internet Explorer, nie stylizują go inaczej niż elementu
<span>
. - Opera, Firefox i inne dodają kropkowane podkreślenie zawartości elementu.
- Kilka przeglądarek nie tylko dodaje kropkowane podkreślenie, ale także dodaje do nich wariant "small-caps"; aby uniknąć tej stylizacji, dodanie czegoś w rodzaju
font-variant
: none
w CSS załatwia tę sprawę.
Przykłady
Oznaczanie skrótu semantycznie
Aby oznaczyć skrót bez podania rozwinięcia lub opisu, po prostu użyj <abbr>
bez żadnych atrybutów, jak widać w tym przykładzie.
HTML
<p>Używanie <abbr>HTML</abbr> jest fajne i proste!</p>
Rezultat
Używanie HTML jest fajne i proste!
Stylistyka skrótów
Możesz użyć CSS, aby ustawić własny styl skrótów, jak pokazano w tym prostym przykładzie.
HTML
<p>Używając <abbr>CSS</abbr>, możesz stylizować swoje skróty!</p>
CSS
abbr {
font-variant: all-small-caps;
}
Rezultat
Używając CSS, możesz stylizować swoje skróty!
Dostarczanie rozszerzenia
Dodanie atrybutu title
pozwala na rozwinięcie lub zdefiniowanie skrótu lub akronimu.
HTML
<p>Funkcję rejestru nazw internetowych w domenie .pl pełni <abbr title="Naukowa i Akademicka Śieć Komputerowa">NASK</abbr>.</p>
Rezultat
Funkcję rejestru nazw internetowych w domenie .pl pełni NASK.
Definiowanie skrótu
Możesz użyć <abbr>
w połączeniu z <dfn>
, aby bardziej formalnie zdefiniować skrót, jak pokazano tutaj.
HTML
<p><dfn id="html"><abbr title="HyperText Markup Language">HTML</abbr>
</dfn> jest językiem znaczników używanym do tworzenia semantyki i struktury strony internetowej.</p>
<p><dfn id="spec">Specyfikacja</dfn>
(<abbr title="Specyfikacja">spec</abbr>) jest dokumentem, który przedstawia w szczegółach, jak technologia lub API ma funkcjonować i jak wygląda dostęp do nich.</p>
Rezultat
HTML jest językiem znaczników używanym do tworzenia semantyki i struktury strony internetowej.
Specyfikacja (spec) jest dokumentem, który przedstawia w szczegółach, jak technologia lub API ma funkcjonować i jak wygląda dostęp do nich.
Zobacz bardziej szczegółowe przykłady w artykule Jak oznaczyć skróty i uczynić je zrozumiałymi.
Kwiestie dostępności
Wypisanie akronimu lub skrótu w całości za pierwszym razem, gdy jest on używany na stronie, jest korzystne, aby pomóc ludziom go zrozumieć, zwłaszcza jeśli treść jest żargonem technicznym lub branżowym.
Przykład
<p>JavaScript Object Notation (<abbr>JSON</abbr>) jest lekkim formatem wymiany danych.</p>
Jest to szczególnie pomocne dla osób, które nie znają terminologii lub pojęć omawianych w treści, dla osób, które są nowe w języku oraz dla osób z problemami poznawczymi.
Specyfikacje
Specyfikacja | Status | Komentarz |
---|---|---|
HTML Living Standard The definition of '<abbr>' in that specification. |
Living Standard | |
HTML5 The definition of '<abbr>' in that specification. |
Recommendation | |
HTML 4.01 Specification The definition of '<abbr>' in that specification. |
Recommendation |
Kompatybilność z przeglądarką
BCD tables only load in the browser
Zobacz także
- Używanie elementu
<abbr>
- Inne elementy zawierające semantykę na poziomie tekstu:
<a>
,<em>
,<strong>
,<small>
,<cite>
,<q>
,<dfn>
,<time>
,<code>
,<var>
,<samp>
,<kbd>
,<sub>
,<sup>
,<b>
,<i>
,<mark>
,<ruby>
,<rp>
,<rt>
,<bdo>
,<span>
,<br>
,<wbr>
. - Przestarzały element
<acronym>
, którego obowiązki zostały przeniesione na<abbr>