Baseline Widely available
Das title
globale Attribut enthält Text, der beratende Informationen über das zugehörige Element darstellt.
<p>
Use the <code>title</code> attribute on an <code>iframe</code> to clearly
identify the content of the <code>iframe</code> to screen readers.
</p>
<iframe
title="Wikipedia page for the HTML language"
src="https://en.m.wikipedia.org/wiki/HTML"></iframe>
<iframe
title="Wikipedia page for the CSS language"
src="https://en.m.wikipedia.org/wiki/CSS"></iframe>
iframe {
height: 200px;
margin-bottom: 24px;
width: 100%;
}
Die Hauptverwendung des title
-Attributs besteht darin, <iframe>
-Elemente für unterstützende Technologien zu kennzeichnen.
Das title
-Attribut kann auch verwendet werden, um Steuerelemente in Datentabellen zu kennzeichnen.
Das title
-Attribut, wenn es zu <link rel="stylesheet">
hinzugefügt wird, erstellt ein alternatives Stylesheet. Beim Definieren eines alternativen Stylesheets mit <link rel="alternate">
ist das Attribut erforderlich und muss auf einen nicht-leeren String gesetzt werden.
Wenn es im Ãffnungstag der <abbr>
enthalten ist, muss das title
eine vollständige Erweiterung der Abkürzung oder des Akronyms sein. Anstatt title
zu verwenden, geben Sie, wenn möglich, beim ersten Gebrauch die Erweiterung der Abkürzung oder des Akronyms im Klartext an und verwenden Sie <abbr>
, um die Abkürzung zu kennzeichnen. Dies ermöglicht allen Nutzern zu wissen, welchen Namen oder Begriff die Abkürzung oder das Akronym verkürzt, und gibt den Benutzeragenten einen Hinweis, wie der Inhalt angekündigt werden soll.
Während title
verwendet werden kann, um ein programmgesteuert zugeordnetes Label für ein <input>
-Element bereitzustellen, ist dies keine gute Praxis. Verwenden Sie stattdessen ein <label>
.
Das title
-Attribut kann mehrere Zeilen enthalten. Jedes U+000A LINE FEED
(LF
) Zeichen stellt einen Zeilenumbruch dar. Einige VorsichtsmaÃnahmen müssen getroffen werden, da dies bedeutet, dass das Folgende über zwei Zeilen gerendert wird:
<p>
Newlines in <code>title</code> should be taken into account. This
<span
title="This is a
multiline title">
example span
</span>
has a title a attribute with a newline.
</p>
<hr />
<pre id="output"></pre>
JavaScript
Wir können das title
-Attribut abfragen und es im leeren <pre>
-Element wie folgt anzeigen:
const span = document.querySelector("span");
const output = document.querySelector("#output");
output.textContent = span.title;
Ergebnis Vererbung des Title-Attributs
Wenn ein Element kein title
-Attribut hat, erbt es dieses von seinem übergeordneten Knoten, der es wiederum von seinem übergeordneten Knoten erben kann, und so weiter.
Wenn dieses Attribut auf einen leeren String gesetzt ist, bedeutet dies, dass die title
s der Vorfahren irrelevant sind und nicht im Tooltip für dieses Element verwendet werden sollten.
<div title="CoolTip">
<p>Hovering here will show "CoolTip".</p>
<p title="">Hovering here will show nothing.</p>
</div>
Ergebnis Barrierefreiheit
Die Verwendung des title
-Attributs ist hoch problematisch für:
Dies liegt an der inkonsistenten Unterstützung durch den Browser, die durch das zusätzliche Parsen der vom Browser gerenderten Seite durch unterstützende Technologien verschärft wird. Wenn ein Tooltip-Effekt gewünscht ist, ist es besser, eine zugänglichere Technik zu verwenden, die mit den oben genannten Navigationsmethoden zugänglich ist.
HTMLElement.title
, das dieses Attribut widerspiegelt.RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4