nicht angemeldet
Klassen vererben
Hallo Leute,
ich habe eine Klasse für einen <TD> festgelegt. Diese Klasse möchte ich in einer neuen Klasse aber weiter vererben:
<style>
td.eins { background-color:red; font-size:8pt; }
td.eins td.zwei { font-size:12pt; }
</style>
...
<table>
<tr>
<td class="eins">Hintergrund rot, font 8pt</td><td class="zwei">Hintergrund auch rot, aber font 12pt</td>
</tr>
</table>
...
D.h. Hintergrundfarbe soll in Klasse 2 erhalten bleiben. Und nur die Font-Grösse soll anderes sein.
Wie kann man so etwas machen ?
Gruss,
Nicolas
-
Hallo Nicolas,
ich habe eine Klasse für einen <TD> festgelegt. Diese Klasse möchte ich in einer neuen Klasse aber weiter vererben:
Ein Weg, Klassen an andere Klassen direkt weiterzuvererben, ist mir nicht bekannt. Die Vererbung von CSS-Eigenschaften laeuft ueber die Verschachtelung von HTML-Elementen - innere Elemente erben CSS-Eigenschaften der aeusseren. Ein Weg, in deinem Fall das Gewuenschte zu erreichen, waere also:
<html><head><title></title></head>
<style type="text/css">
.eins { background-color:red; font-size:8pt; }
.zwei { font-size:12pt; }
</style>
<body>
<table>
<tr>
<td class="eins">ein kleiner Testtext</td>
<td class="zwei">ein kleiner Testtext</td>
<td class="eins"><div class="zwei">ein kleiner Testtext</div></td>
</tr>
</table>
</body>
</html>viele Gruesse
Stefan Muenz-
Hallo Leute,
vielen Dank an alle, die mir geantwortet haben.
Geht das aber vielleicht über CSS Expressions, z.b.<style>
.eins { background-color:red; font-size:8pt; }
.zwei {expression(document.body.eins.backgroundColor);}
</style>Viele Grüsse,
NicolasHallo Nicolas,
ich habe eine Klasse für einen <TD> festgelegt. Diese Klasse möchte ich in einer neuen Klasse aber weiter vererben:
Ein Weg, Klassen an andere Klassen direkt weiterzuvererben, ist mir nicht bekannt. Die Vererbung von CSS-Eigenschaften laeuft ueber die Verschachtelung von HTML-Elementen - innere Elemente erben CSS-Eigenschaften der aeusseren. Ein Weg, in deinem Fall das Gewuenschte zu erreichen, waere also:
<html><head><title></title></head>
<style type="text/css">
.eins { background-color:red; font-size:8pt; }
.zwei { font-size:12pt; }
</style>
<body>
<table>
<tr>
<td class="eins">ein kleiner Testtext</td>
<td class="zwei">ein kleiner Testtext</td>
<td class="eins"><div class="zwei">ein kleiner Testtext</div></td>
</tr>
</table>
</body>
</html>viele Gruesse
Stefan Muenz
-
-
Hallo Leute,
ich habe eine Klasse für einen <TD> festgelegt. Diese Klasse möchte ich in einer neuen Klasse aber weiter vererben:
<style>
td.eins { background-color:red; font-size:8pt; }
td.eins td.zwei { font-size:12pt; }
</style>...
<table>
<tr>
<td class="eins">Hintergrund rot, font 8pt</td><td class="zwei">Hintergrund auch rot, aber font 12pt</td>
</tr>
</table>
...
D.h. Hintergrundfarbe soll in Klasse 2 erhalten bleiben. Und nur die Font-Grösse soll anderes sein.Wie kann man so etwas machen ?
Gruss,
Nicolas-
Hallo Leute,
Hi,
sorry, falsche Taste erwischt, darum hier nochmal mit Antwort
ich habe eine Klasse für einen <TD> festgelegt. Diese Klasse möchte ich in einer neuen Klasse aber weiter vererben:
<style>
td.eins { background-color:red; font-size:8pt; }
td.eins td.zwei { font-size:12pt; }
</style>CSS-Klassen und C++/Java-Klassen unterscheiden sich da.
td.eins td.zwei würde eine td mit Klasse zwei innerhalb einer td mit Klasse eins formatieren.
Was man machen könnte:
.red { background-color:red; }
.big { font-size:12pt; }
.small { font-size:8pt; }und dann im HTML:
<td class="red big">groß und rot</td><td class="red small">klein und rot</td>
Netscape 4.x kann das aber afair nicht...
...
<table>
<tr>
<td class="eins">Hintergrund rot, font 8pt</td><td class="zwei">Hintergrund auch rot, aber font 12pt</td>
</tr>
</table>
...
D.h. Hintergrundfarbe soll in Klasse 2 erhalten bleiben. Und nur die Font-Grösse soll anderes sein.Wie kann man so etwas machen ?
Gruss,
Nicolascu,
Andresa
-
-
Moin!
ich habe eine Klasse für einen <TD> festgelegt. Diese Klasse möchte ich in einer neuen Klasse aber weiter vererben:
<style>
td.eins { background-color:red; font-size:8pt; }
td.eins td.zwei { font-size:12pt; }
</style>...
<table>
<tr>
<td class="eins">Hintergrund rot, font 8pt</td><td class="zwei">Hintergrund auch rot, aber font 12pt</td>
</tr>
</table>Gewöhnlicherweise kann man in CSS zuerst allgemeine Definitionen machen, und diese dann durch konkretere Definitionen ergänzen und ersetzen. In deinem Fall:
Wenn du für td allgemein die Hintergrundfarbe definierst, und für td.eins und td.zwei unterschiedliche Schriftgrößen, kriegst du genau den gewünschten Effekt.
Nachteil: Andere TDs ohne Klasse werden auch beeinflußt.
Die Verschachtelung von Elementen, wie von Stefan vorgeschlagen, funktioniert natürlich auch und hätte diesen Nachteil nicht.
Und zu guter letzt: Warum nicht die Hintergrundfarbe doppelt definieren? Ist zwar dann keine Vererbung mehr, aber funktioniert ohne Eingriffe in den HTML-Text. :)
- Sven Rautenberg
-
Moin!
Tach
[...]»» Und zu guter letzt: Warum nicht die Hintergrundfarbe doppelt definieren? Ist zwar dann keine Vererbung mehr, aber funktioniert ohne Eingriffe in den HTML-Text. :)
Auch eine gute Idee.
Und wenn man dann noch einen Präprozessor benutzt, um aus einer Rohfassung der CSS-Datei die endgültige Version zu machen, braucht man die eigentliche Farbe auch nur einmal definieren:#define TDBACKGROUND red
td.eins { background-color:TDBACKGROUND; font-size:8pt; }
td.zwei { background-color:TDBACKGROUND; font-size:12pt; }so mach ich das bei mir - da verschiedene feste Werte an verschiedensten Stellen gebraucht werden, definiere ich die einmal und habe an den Stellen, wo die Werte benutzt werden, nur symbolische Namen stehen, das Ersetzen macht der Präprozessor für mich.
Will ich dann was ändern, muß ich nicht die ganze Datei durchsuchen, wo zufällig der jeweilige Wert steht...- Sven Rautenberg
Andreas
-
Moin!
Tach
Nabend, Andreas
Und wenn man dann noch einen Präprozessor benutzt,
als jemand, der seit 20 Jahren PL/I programmiert aber C nur aus der Ferne kennt (als write-only-language: was ein C-Spezi mal geschrieben hat kann keiner mehr lesen), kenne ich mich zwar (a) mit Preprozessoren aus, habe aber (b) auf meinem Rechner nicht so'n Ding. Dein Vorschlag gefällt mir aber sehr gut. Weißt Du, ob es irgendwo einen freien Preprozessor gibt, der alleine Läuft (wo man also keine Entwicklungsumgebung, Profile, Makes und so braucht) ?
Wenn nicht, wäre meine handgestrickte letzte Möglichkeit dann wohl so etwas:
td.eins { background-color:$TDBACKGROUND$; font-size:8pt; }
td.zwei { background-color:$TDBACKGROUND$; font-size:12pt; }Und ein Batchfile, Word-Macro, Textpad-Script oder whatever, wo sinngemäß ein
change all $TDBACKGROUND$ red
durchgeführt wird, und die geänderte Datei unter anderem Namen weggeschrieben wird.
Stimmt doch so etwa, oder?
Aber, wie gesagt, ein echter Preprocessor wäre mir lieber. Kennst Du da was geeignetes?
Vorab schon mal vielen Dank fürs Lesen uuuuuuund
Tschüss
Angy
-
-
hi
...
<table>
<tr>
<td class="eins">Hintergrund rot, font 8pt</td><td class="zwei">Hintergrund auch rot, aber font 12pt</td>
</tr>
</table>
...
D.h. Hintergrundfarbe soll in Klasse 2 erhalten bleiben. Und nur die Font-Grösse soll anderes sein.in den konkreten Fall (also wenn es wirklich nur die beiden Zellen da gibt) wäre es vielleicht so am besten:
<style>
tr.eins td { background-color:red; font-size:8pt; }
tr.eins td.zwei { font-size:12pt; }
</style><table>
<tr class="eins">
<td>Hintergrund rot, font 8pt</td><td class="zwei">Hintergrund auch rot, aber font 12pt</td>
</tr>
</table>Grüße aus Bleckede
Kai