CSS-Klasse auf mehrere Elemente anwenden?

Status
Nicht offen für weitere Antworten.

DarthShader

Erfahrenes Mitglied
Hallo zusammen,

ist es möglich, einen ganzen Block mit einer CSS Klasse zu definieren, sodass ich z.B. statt

HTML:
<table class="content">
<tr class="content">
	<th class="content">Eins</th>
	<th class="content">Zwei</th>
</tr>
<tr class="content">
	<td class="content">Drei</td>
	<td class="content">Vier</td>
</tr>

sowas in der Art schreiben kann:

HTML:
<div class="content">
	<table>
	<tr>
		<th>Eins</th>
		<th>Zwei</th>
	</tr>
	<tr>
		<td>Drei</td>
		<td>Vier</td>
	</tr>
</div>

Letzteres funktioniert so natürlich nicht, aber ich denke, es macht klar, was ich möchte: Ich will das "class='content'" gerne weglassen können, damit meine Tabellen übersichtlicher werden.


Über eine Antwort würde ich mich sehr freuen


Vielen Dank für Eure Hilfe!
 
Hi,

du kannst bei der zweiten Markup-Variante den Selektor für Nachfahren nutzen:
CSS:
.content table, .content tr, .content th, .content td { /* CSS-Formatierungen */ }

Mich würde nur interessieren, welche einheitliche CSS-Formatierung(en) du für all diese Tabellenelemente in einer Klasse vorgesehen hast?

Will sagen, da dürfte in der ersten HTML-Variante der eine oder andere Klassenaufruf bzw. in meiner vorgeschlagenen CSS-Regel der eine oder andere Selektor überflüssig sein.

Oder stellt sich dein Stylesheet beispielsweise so dar?
CSS:
table.content { width:600px; }
tr.content { background:#ddd; }
th.content { color:#f00; }
td.content { color:#000; }

Dann ergibt sich daraus für die zweite HTML-Variante:
CSS:
.content table { width:600px; }
.content tr { background:#ddd; }
.content th { color:#f00; }
.content td { color:#000; }

mfg Maik
 
Status
Nicht offen für weitere Antworten.
Zurück