Bezeichnung von Selektoren
Blabal
- css
Hallo! Ich hoffe ich darf euch nochmals mit einer Frage belästigen!
In einem kleinen aber feinen Büchlein habe ich gelesen, dass man ID- und Klassenselektoren das betreffende HTML Element voranstellen kann.
Also nicht #irgendwas oder .irgendwas
sondern div#irgendwas oder div.irgendwas
Sind nun 2 Selektoren eindeutig die z.B. div#irgendwas und table#irgendwas heißen? Im der HTML-Datei würde das ID-Attribut dann ja sowohl bei dem div-Container als auch bei der Tabelle 'irgendwas' lauten. Werden diese dann trotzdem unterschiedlich behandelt?
Hoffe ich konnte mich halbwegs verständlich ausdrücken.
Danke vorab!
Sind nun 2 Selektoren eindeutig die z.B. div#irgendwas und table#irgendwas heißen?
Eindeutigkeit entsteht nicht im CSS.
Es entsteht im HTML, welches vorschreibt dass eine ID nur einmalig pro Dokument sein darf.
Im der HTML-Datei würde das ID-Attribut dann ja sowohl bei dem div-Container als auch bei der Tabelle 'irgendwas' lauten. Werden diese dann trotzdem unterschiedlich behandelt?
Es gilt nach wie vor die obige Regel. Wie Browser mit Regelverletzungen umgehen müssen, ist in HTML < 5 nicht geregelt
mfg Beat
Hmmm... Ich fürche ich versteh's nicht ganz oder ich habe meine Frage nicht wirklich verständlich rüber gebracht. Aber vielleicht macht es ja ein Beispiel einfacher. Also wieso funktioniert unten angeführtes Beispiel in Bezug auf die verschiedenen Background-colors obwohl die gleiche ID 3x vorkommt?
<html>
<head>
<meta http-equiv='content-type' content='text/html; charset=ISO-8859-1'>
<link rel="stylesheet" type="text/css" href="main.css">
<title>titel</title>
<style type="text/css">
div#xyz
{
background-color : #D9D9FF;
height : 100px;
width : 100px;
}
th#xyz
{
background-color : #EAB795;
}
td#xyz
{
background-color : #FFFF80
}
</style>
</head>
<body>
<div id="xyz">
<table>
<tr>
<th id="xyz">Rowheader</td>
</tr>
<tr>
<td id="xyz">Row1</td>
</tr>
<tr>
<td>Row2</td>
</tr>
</table>
</div>
</body>
</html>
Danke!
Hmmm... Ich fürche ich versteh's nicht ganz oder ich habe meine Frage nicht wirklich verständlich rüber gebracht. Aber vielleicht macht es ja ein Beispiel einfacher. Also wieso funktioniert unten angeführtes Beispiel in Bezug auf die verschiedenen Background-colors obwohl die gleiche ID 3x vorkommt?
Eine "ID" IDentifiziert (daher auch der Name) ein Element im HTML-Dokument und darf deshalb nur ein einziges Mal (pro Dokument) vorkommen.
Die von dir dargebotene Konstruktion ist kein valides HTML.
Im Praxistest ignorieren die meisten Browser diesen schweren Fehler und stellen die Elemente trotzdem "korrekt" dar.
Eine "ID" IDentifiziert (daher auch der Name) ein Element im HTML-Dokument und darf deshalb nur ein einziges Mal (pro Dokument) vorkommen.
OK, soweit hab ich's verstanden.
Die von dir dargebotene Konstruktion ist kein valides HTML.
Und wenn es nun keine ID ist sondern eine Class? Ich denke, dass es dann valides HTML ist. Es funktioniert auch in FF + IE.
Meine Grundsätzliche Frage ist eigentlich ob folgendes im CSS sindvoll zum formatieren einer Tabelle ist und ob das jetzt 3 unterschiedliche Klassen sind oder nicht. Wie gesagt funktioniert es. Ich weiß nur nicht ob das so gut ist.
div.xyz
{
background-color : #D9D9FF;
height : 100px;
width : 100px;
}
th.xyz
{
background-color : #EAB795;
}
td.xyz
{
background-color : #FFFF80
}
Danke nochmals!
Und wenn es nun keine ID ist sondern eine Class?
Zu welchem Zweck?
Ich denke, dass es dann valides HTML ist.
Ja.
Meine Grundsätzliche Frage ist eigentlich ob folgendes im CSS sindvoll zum formatieren einer Tabelle ist
Zu welchem Zweck?
und ob das jetzt 3 unterschiedliche Klassen sind oder nicht.
Nein, es ist 3x dieselbe Klasse - namentlich "xyz".
Wie gesagt funktioniert es.
Ja <div class="red">foo</div>
und .red { color: blue; }
funktioniert auch.
Ich weiß nur nicht ob das so gut ist.
Zu welchem Zweck?
Nein, es ist 3x dieselbe Klasse - namentlich "xyz".
Und wieso haben dann der div-Container, die Kopfzelle, und die erste Tabellenzelle unterschiedliche Farben wenn es dieselbe Klasse ist? Oder kann ich in einer Klasse verschiedene HTML-Elemente definieren
Zu welchem Zweck?
Ich habe einen div-Container. In dem befindet sich ein Formular und eine Tabelle zur Datenerfassung. Diese werden per CSS formatiert. Wenn ich die entsprechenden Selektoren jetzt div.erfassungsfrm, table.erfassungsfrm, th.erfassungsfrm, td.erfassungsfrm nennen würde, würde ich das übersichtlich finden. Vielleicht.
Vielleicht sollte ich in's Wochenende gehen ;-)
Hi,
Ich habe einen div-Container. In dem befindet sich ein Formular und eine Tabelle zur Datenerfassung. Diese werden per CSS formatiert. Wenn ich die entsprechenden Selektoren jetzt div.erfassungsfrm, table.erfassungsfrm, th.erfassungsfrm, td.erfassungsfrm nennen würde, würde ich das übersichtlich finden. Vielleicht.
Dann wären Selektoren wie
#erfassungsfrm
#erfassungsfrm table
#erfassungsfrm td
sinnvoller - sprich: Ausnutzung des Nachfahren-Verhältnisses.
cu,
Andreas
Und wieso haben dann der div-Container, die Kopfzelle, und die erste Tabellenzelle unterschiedliche Farben wenn es dieselbe Klasse ist?
Weil du durch die Kombination mit dem Element-Selektor unterschiedliche Gruppen von Elementen ansprichst du diese anders formatierst.
Dass du dabei unlogische Kombinationen von Eigenschaften wählen kannst, ist nicht die Schuld des Systems sondern bestenfalls deine ;)
Ein gutes Beispiel wäre z.B. die Klasse "warnung" - ein p-Element mit der Klasse "warnung" könnte einen roten Rahmen und scharze Schrift haben, während ein strong-Element mit der Klasse "warnung" über keinen Rahmen, dafür aber rote Schrift verfügt.
Oder kann ich in einer Klasse verschiedene HTML-Elemente definieren
Umgekehrt, du kannst mehreren HTML-Elementen dieselbe Klasse zuweisen.
Zu welchem Zweck?
Ich habe einen div-Container. In dem befindet sich ein Formular und eine Tabelle zur Datenerfassung. Diese werden per CSS formatiert. Wenn ich die entsprechenden Selektoren jetzt div.erfassungsfrm, table.erfassungsfrm, th.erfassungsfrm, td.erfassungsfrm nennen würde, würde ich das übersichtlich finden. Vielleicht.
Ich rate dir, dich mit Grundlagen von HTML und CSS auseinanderzusetzen - du willst offenbar einer Gruppe von Elementen in einem gemeinsamen gruppierenden Element eine bestimmte Formatierung zukommen lassen.
Dafür ist der Nachfahrenselektor (" ") wesentlich besser geeignet als jedes Element mit einer Klasse vollzusch^Wversehen - in deinem Fall wahrscheinlich sogar eine ID und keine Klasse. Sofern das Formular nur 1x vorkommen kann ist eine ID das mittel der Wahl, gibt es hingegen verschiedene Typen von Formularen/Tabellen innerhalb dieser Container oder mehrere Formualre dieser Art wäre eine Klasse interessanter.
Aussehen könnte das so:
<div class="loeschen">
<form />
<table />
</div>
<div class="aendern">
<form />
<table />
</div>
<div class="loeschen">
<form />
<table />
</div>
.erfassen form {
border: 1px solid green;
}
.aendern form {
border: 1px solid blue;
}
.loeschen form {
border: 1px solid red;
}
Vielleicht sollte ich in's Wochenende gehen ;-)
Möglicherweise.
Hi,
Nein, es ist 3x dieselbe Klasse - namentlich "xyz".
Und wieso haben dann der div-Container, die Kopfzelle, und die erste Tabellenzelle unterschiedliche Farben wenn es dieselbe Klasse ist?
Weil *du* es so angegeben hast, dass du es so haben möchtest ...
Oder kann ich in einer Klasse verschiedene HTML-Elemente definieren
Du definierst nicht Elemente „in einer Klasse“, sondern du ordnest Elementen eine Klasse zu, der sie angehören sollen.
MfG ChrisB
Funktionieren tut es, valide ist es (mit Klassen statt ID) auch. Ob es Sinn macht, ist von Konstruktion zu Konstruktion unterschiedlich - der Leserlichkeit des Quelltextes hilft es mit Sicherheit nicht.
@@Blabla:
nuqneH
Meine Grundsätzliche Frage ist eigentlich ob folgendes im CSS sindvoll zum formatieren einer Tabelle ist und ob das jetzt 3 unterschiedliche Klassen sind oder nicht.
Wie du es notiert hattest, ist es eine Klasse "xyz". Und eine Klasse mit dieser Bezeichnung ist niemals sinnvoll.
Ob es sinnvoll ist, verschiedene Elemente verschiedener Typen derselben Klasse angehören zu lassen, hängt vom Anwendungsfall ab. "xyz" ist nicht aussagekräftig genug, um da ja oder nein zu sagen.
Qapla'
Hmmm... Ich fürche ich versteh's nicht ganz oder ich habe meine Frage nicht wirklich verständlich rüber gebracht. Aber vielleicht macht es ja ein Beispiel einfacher. Also wieso funktioniert unten angeführtes Beispiel in Bezug auf die verschiedenen Background-colors obwohl die gleiche ID 3x vorkommt?
Weil Browser netter als erlaubt sind.
mfg Beat
Hi,
In einem kleinen aber feinen Büchlein habe ich gelesen, dass man ID- und Klassenselektoren das betreffende HTML Element voranstellen kann.
Also nicht #irgendwas oder .irgendwas
sondern div#irgendwas oder div.irgendwasSind nun 2 Selektoren eindeutig die z.B. div#irgendwas und table#irgendwas heißen? Im der HTML-Datei
Wieso "in der HTML-Datei"? "in den HTML-Dokumenten" wäre richtig - eine CSS-Resource kann ja auf mehrere HTML-Dokumente angewandt werden.
würde das ID-Attribut dann ja sowohl bei dem div-Container als auch bei der Tabelle 'irgendwas' lauten.
Nein. Pro HTML-Dokument darf jeder id-Attributwert höchstens einmal vorkommen.
In einigen HTML-Dokumenten kann dieser id-Wert einem div-Element, in anderen einem table-Element, in weiteren einem span-Element und in anderen gar keinem Element zugeordnet sein.
Dann werden halt im jeweiligen HTML-Dokument nicht alle rulesets aus dem CSS verwendet.
Genauso, wie wenn nur #irgendwas dastünde und kein Element mit diesem id-Wert im Dokument vorhanden wäre.
cu,
Andreas