Ausbreitung des Coronavirus führt zu immer mehr Tafel-Schließungen
Um 1,6 Millionen bedürftige Tafel-Nutzer:innen jetzt nicht allein zu lassen, ruft Tafel Deutschland e.V. zu Solidarität und Unterstützung auf. Sie wollen helfen? Informationen finden Sie unter tafel.de.
Eine weitere Möglichkeit ist der Einkauf im CoronaCharityShop – alle Einnahmen gehen zu 100 % an die Tafeln. Herzlichen Dank für Ihre Unterstützung.
CSS/Selektoren/Attributselektor/Wert
Aus SELFHTML-Wiki
< CSS | Selektoren | Attributselektor
Attributselektoren erlauben es, Elemente nur dann anzusprechen, wenn das Attribut einen bestimmten Wert oder einen bestimmten Wertabschnitt besitzt. Sie können Elemente ansprechen,
- deren Attribut einen genau festgelegten Wert besitzt. Dazu wird innerhalb der eckigen Klammern des Selektors ein Gleichheitszeichen gefolgt von dem abzufragenden Wert notiert (
[attributname=attributwert]). - deren Attribut eine Zeichenkette enthält, die durch Leerzeichen von anderen Bestandteilen des Attributwerts getrennt ist. Dazu notieren Sie den Attributselektor wie zuvor beschrieben und zusätzlich eine Tilde („~“) vor dem Gleichheitszeichen (
[attributname~=attributwert]). Enthält der im Selektor angegebene Wert ein Leerzeichen, so spricht dieser Selektor kein Element an. - deren Attribut mit einer Zeichenkette beginnt, die durch den Bindestrich vom Rest des Attributwerts getrennt ist. Dazu notieren Sie den Attributselektor wie zuvor beschrieben, jedoch mit dem Verkettungszeichen („|“) vor dem Gleichheitszeichen (
[attributname|=attributwert]).
Beachten Sie: Beginnt der im Selektor angegebene Wert mit einer Ziffer oder besteht aus anderen Zeichen als Buchstaben, Ziffern, Binde- und Unterstrich, so muss er innerhalb von einfachen oder doppelten Anführungszeichen notiert werden.
Beispiel
ansehen …
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS-Beispiel: Attributselektor</title>
<style>
[type=submit] {font-weight: bold;}
[title~=Berlin] {color: green;}
[hreflang|=de] {font-style: italic;}
</style>
</head>
<body>
<!-- 1. -->
<h1>Der [attribut=wert]-Selektor</h1>
<p><input type="text" value="Beispiel"> <input type="submit" value="Absenden"></p>
<!-- 2. -->
<h1>Der [attribut~=wert]-Selektor</h1>
<ul>
<li title="Berlin: eine schöne Stadt">Viele Informationen.</li>
<li title="Die Stadt Berlin besteht aus mehreren Stadteilen">Mehr Informationen.</li>
<li title="Das Brandenburger Tor steht in Berlin">Noch mehr Informationen.</li>
</ul>
<!-- 3. -->
<h1>Der [attribut|=wert]-Selektor</h1>
<ul>
<li><a href="http://www.example.org/" hreflang="de">Beispielverweis</a></li>
<li><a href="http://www.example.com/" hreflang="de-at">Beispielverweis</a></li>
<li><a href="http://www.example.net/" hreflang="en-de">Beispielverweis</a></li>
</ul>
</body>
</html>
Beachten Sie: In HTML gibt es Attribute, denen kein Wert zugewiesen werden muss, z.B. das
checked-Attribut bei input-Elementen. Wird so einem Attribut kein Wert zugewiesen, erhält die DOM-Abbildung dieses Attributs automatisch eine leere Zeichenkette als Wert zugewiesen. Die Selektoren [checked=""], [checked~=""] und [checked|=""] würden daher das Element ansprechen.Siehe auch[Bearbeiten]
- Attributpräsenz:
[a] - Teilübereinstimmung:
[a^=v],[a$=v],a[*=v]
type-Attribut des „Absenden“-Knopfes besitzt genau den Wert „submit“. Dadurch wird die Schrift des Elements fett formatiert.