Najnowsze tutoriale tworzenie stron internetowych

Atrybuty HTML


Atrybuty dodatkowe informacje na temat elementów HTML.

Atrybut HTML jest modyfikator typu elementu HTML. Atrybut albo modyfikuje domyślną funkcjonalność typu elementu lub zapewnia funkcjonalność do pewnych typów elementów w stanie funkcjonować prawidłowo bez nich. W składni HTML, atrybutem jest dodany do znacznika początkowego HTML.


Atrybuty HTML

  • Elementy HTML mogą mieć attributes
  • Atrybuty dostarczyć additional information o elemencie
  • Atrybuty są zawsze podane w the start tag
  • Atrybuty są w pary nazwa / wartość, takich jak: name="value"

Opis

atrybutów HTML pojawiają się zwykle jako pary nazwa-wartość, oddzielonych = i są napisane w znaczniku otwierającym elementu, po nazwie elementu:

<tag attribute="value">content to be modified by the tag</tag>

Gdzie nazwy znaczników HTML typ elementu, a atrybutem jest nazwa atrybutu, wartość podanej wartości. Wartość może być ujęty w pojedyncze lub podwójne cudzysłowy, chociaż wartości składające się z pewnych znaków można pozostawić cytowane w HTML (ale nie XHTML) .Leaving atrybut wartości nienotowanych jest uważany za niebezpieczny.

Chociaż większość atrybutów są dostarczane jako sparowanych nazw i wartości, niektóre wpłynąć element po prostu przez swoją obecność w znaczniku otwierającym elementu (jak ismap atrybutu dla elementu img).

Większość elementów może mieć dowolną z kilku wspólnych cech:

Atrybut id zapewnia dokument całej unikalny identyfikator dla element.This może być używany jako selektor CSS, aby zapewnić właściwości prezentacyjnych, przez przeglądarkę, aby skupić uwagę na konkretnego elementu lub przez skrypty do zmiany treści lub prezentacji elementu. Dołączany do adresu URL strony, adres URL bezpośrednio skierowany do konkretnego elementu w dokumencie, typowo podrozdział strony. Na przykład, identyfikator „Atrybuty”.

Atrybut klasa dostarcza sposobu klasyfikowania podobne elementy. Może to być wykorzystywane do celów semantycznych lub do celów prezentacyjnych. Semantycznie, na przykład, zajęcia są wykorzystywane w mikroformatach. Prezencji, na przykład, dokument HTML może użyć class = „oznaczenie notacji”, aby wskazać, że wszystkie elementy z tej wartości klasy podporządkowane są do głównego tekstu dokumentu. Takie elementy mogą być zebrane razem i przedstawione w przypisach na stronie, a nie pojawia się w miejscu, gdzie występują one w kodzie HTML. Innym zastosowaniem prezentacji będzie jako selektor CSS.

Autor może wykorzystać kody stylu non-attributal właściwości prezentacyjnych do konkretnego elementu. Jest uważany za lepszy praktyką jest stosowanie id lub class elementu za atrybuty, aby wybrać element z arkusza stylów, choć czasami może to być zbyt uciążliwe dla prostego i konkretnego zastosowania lub ad hoc stylu właściwości.

Atrybut tytuł służy do mocowania subtextual wyjaśnienie do elementu. W większości przeglądarek atrybut ten jest wyświetlany jako to, co jest często określane jako podpowiedź.

Element skrót skrót, może być stosowane do wykazania te różne atrybuty:

<abbr id="anId" class="aClass" style="color:blue;" title="Hypertext Markup Language">HTML</abbr>

Ten przykład jest wyświetlany jako html; w większości przeglądarek, wskazując kursorem na skrót powinien wyświetlić tekst tytuł „Hypertext Markup Language”.

Większość elementów ma również związane z języka atrybuty lang i dir.


lang Atrybut

Językiem dokument może być uznany w <html> tag.

Język jest zadeklarowane w lang atrybutu.

Deklarowanie języka jest ważne dla aplikacji ułatwień dostępu (screen readers) i wyszukiwarek:

<!DOCTYPE html>
<html lang="en-US">
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

Pierwsze dwie litery określają język (en) . Jeśli istnieje dialekt, użyj dwóch kolejnych liter (US) .


title Atrybut

Akapity HTML są zdefiniowane z <p> tagu.

W tym przykładzie, <p> element posiada atrybut tytułowy. Wartość atrybutu jest " About w3im " :

Przykład

<p title="About w3ii">
w3ii is a web developer's site.
It provides tutorials and references covering
many aspects of web programming,
including HTML, CSS, JavaScript, XML, SQL, PHP, ASP, etc.
</p>
Spróbuj sam "

Podczas przesuwania myszy nad elementem, tytuł będzie wyświetlany jako podpowiedź.


href Atrybut

Linki HTML są zdefiniowane z <a> tagu. Adres link jest określony w href atrybutu:

Przykład

<a href="http://www.w3ii.com">This is a link</a>
Spróbuj sam "

Dowiesz się więcej na temat linków i <a> tagu później w tym kursie.


rozmiar Atrybuty

Obrazy HTML są zdefiniowane z <img> tagu.

Nazwa pliku źródło ( src ) oraz rozmiar obrazu ( width i height ) i są wyposażone w cechy:

Przykład

<img src="w3ii.jpg" width="104" height="142">
Spróbuj sam "

Wielkość obrazu jest określony w pikselach: szerokość = „104” oznacza 104 pikselach szerokości.

Dowiesz się więcej o obrazach i <img> tagu w dalszej części tego podręcznika.


alt Atrybut

alt atrybut określa alternatywny tekst mają być stosowane, gdy nie może być wyświetlany element HTML.

Wartość atrybutu może być odczytany przez "screen readers" . W ten sposób ktoś "listening" do strony internetowej, czyli osobę niewidomą, mogą "hear" element.

Przykład

<img src="w3ii.jpg" alt="w3ii.com" width="104" height="142">
Spróbuj sam "

Proponujemy: Zawsze używać małych Atrybuty

Średnia HTML5 nie wymaga niższych nazwy atrybutów przypadków.

title atrybut może być napisany z górnej lub dolnej przypadku jak Title i / lub TITLE .

W3C zaleca małymi literami w HTML4 i domaga się małymi literami surowsze typów dokumentów, takich jak XHTML.

Dolna przypadek jest najbardziej powszechne. Dolna sprawa jest łatwiejsza do pisania.
Na w3ii zawsze używać małych liter nazw atrybutów.


Proponujemy: Zawsze Cytat wartości atrybutów

Średnia HTML5 nie wymagają cytaty wokół wartości atrybutów.

href atrybut, wykazano powyżej, można zapisać jako:

Przykład

<a href=http://www.w3ii.com>
Spróbuj sam "

W3C recommends cytaty w HTML4 i domaga cytaty surowsze typów dokumentów, takich jak XHTML.

Czasami jest to niezbędne do korzystania z ofert. To nie będą wyświetlane poprawnie, ponieważ zawiera spację:

Przykład

<p title=About w3ii>
Spróbuj sam "

Korzystanie cytaty są najbardziej powszechne. Pomijając cytaty mogą występować błędy.
Na w3ii zawsze używamy cudzysłowów wokół wartości atrybutów.


Pojedyncze lub podwójne cudzysłowy?

Cudzysłowy style są najbardziej powszechne w HTML, ale pojedynczy styl może być również używany.

W niektórych sytuacjach, gdy wartość atrybutu sama zawiera cudzysłów, konieczne jest użycie apostrofów:

<p title='John "ShotGun" Nelson'>

Lub odwrotnie:

<p title="John 'ShotGun' Nelson">

Podsumowanie rozdziału

  • Wszystkie elementy HTML mogą mieć atrybuty
  • HTML title atrybut zapewnia dodatkową "tool-tip" informacje
  • HTML href atrybut zawiera informacje adresowe linki
  • HTML width i height atrybuty dostarczają informacji rozmiarze dla obrazów
  • HTML alt atrybut zawiera tekst dla czytników ekranu
  • Na w3ii zawsze używamy lowercase HTML nazw atrybutów
  • Na w3ii zawsze quote atrybutów z cudzysłowach

Sprawdź się z ćwiczeniami!

Ćwiczenie 1 » ćwiczenie 2» ćwiczenie 3 » ćwiczenie 4» ćwiczenie 5 »


Atrybuty HTML

Poniżej znajduje się alfabetyczna lista niektórych atrybutów często używanych w HTML:

Atrybut Opis
alt Określa alternatywny tekst dla obrazka
disabled Określa, że ​​element wejściowy powinien być wyłączony
href Określa adres URL (web address) o link
id Określa unikalny identyfikator dla elementu
src Określa adres URL (web address) do obrazka
style Określa inline styl CSS dla elementu
title Określa dodatkowe informacje o elemencie (displayed as a tool tip)

Pełną listę wszystkich atrybutów dla każdego elementu HTML, jest wymieniony w naszej: tag HTML Reference .