Atrybut alt znacznika HTML <img>
Definicja i użycie
alt
Atrybut jest atrybutem obowiązkowym, który określa tekst zastępczy, który jest wyświetlany, gdy obraz nie może być wyświetlony.
Jeśli użytkownik nie może zobaczyć obrazu z powodu następujących przyczyn, atrybut alt może dostarczyć alternatywnej informacji dla obrazu:
- Prędkość połączenia jest zbyt wolna
- Błąd w atrybucie src
- Przeglądarka wyłączyła obrazy
- Użytkownik używa czytnika ekranowego
Atrybut alt znacznika <img> określa tekst zastępczy, który jest wyświetlany w przeglądarce zamiast obrazu, gdy obraz nie może być wyświetlony lub gdy użytkownik wyłączył wyświetlanie obrazów.
Polecamy, abyście używali tej atrybutu dla każdej obrazu w dokumencie. W ten sposób, nawet jeśli obraz nie może być wyświetlony, użytkownik może zobaczyć jakie informacje stracił. Ponadto, dla osób niepełnosprawnych, atrybut alt通常是 jedynym sposobem, aby zrozumieć zawartość obrazu.
Podpowiedź:Jeśli chcesz utworzyć podpowiedź dla obrazu, użyj Atrybut title!
Podpowiedzi i komentarze
Komentarz:alt
Wartość atrybutu to ciąg znaków, który może zawierać maksymalnie 1024 znaków, w tym spacje i znaki interpunkcyjne. Ten ciąg znaków musi być zawarty w cudzysłowie. Tekst alt może zawierać odniesienia do specjalnych znaków, ale nie pozwala na zawieranie innych kategorii znaczników, zwłaszcza nie pozwala na style znaczników.
Komentarz:Gdy użytkownik przeniesie mysz nad element img, Internet Explorer wyświetli wartość atrybutu alt. To zachowanie nie jest poprawne. Wszystkie inne przeglądarki zbliżają się do normy, wyświetlając tekst zastępczy tylko w przypadku, gdy obraz nie może być wyświetlony.
Podpowiedź:Jeśli chcesz utworzyć podpowiedź dla obrazu, użyj Atrybut title。
Przykład
Przykład 1
<img src="/i/eg_tulip.jpg" alt="Shanghai Flower Port - Tulip" />
Jeśli obraz nie może być wyświetlony, przeglądarka wyświetli tekst zastępczy, tak jak tutaj:

Ponadto, gdy użytkownik przeniesie mysz nad obrazem, najnowsze przeglądarki wyświetlają opisujący tekst w polu tekstowym. Poniższy kod dodaje opisujący tekst do atrybutu alt obrazu:
Przenieś mysz nad poniższe zdjęcie, aby zobaczyć odpowiedni efekt:

Tekst w czerwonym okręgu jest efektem, który jest wyświetlany, gdy użytkownik przeniesie mysz nad obrazem w przeglądarce IE7:

Przykład 2
Zdefiniowano obraz z alternatywnym tekstem:
<img src="img_girl.jpg" alt="Dziewczyna w kurtce" width="500" height="600">
Gramatyka
<img alt="text">
Wartość atrybutu
Wartość | Opis |
---|---|
text |
Określa alternatywny tekst obrazu. Zasady użycia tekstu alt:
|
Obsługa przeglądarek
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
Wsparcie | Wsparcie | Wsparcie | Wsparcie | Wsparcie |