Vererbung von Eigenschaften

[Stefan Hoba]

Es steht nirgends, dass es geht, es steht aber auch nirgends, dass es nicht geht...
Ich habe viele Styles, die sich nur in einer Eigenschaft unterscheiden, z.B. der Schriftgröße. Meine Idee: ich definiere ein Style ".alle", in dem alle gemeinsamen Eigenschaften definiert werden. Basierend auf diesem Style entwickle ich verschiedene Styles, die nur noch die Schriftgröße definieren, alle anderen Eigenschaften aber von ".alle" übernehmen.
Also: wie geht das??

Stefan

[stefan(klein geschrieben)]

hi,

ich hoffe ich habe die frage richtig verstanden.
das sollte gehen, z.B.
td {font-size:14px;
    font-family:arial, sans-serif;
   }
und dann mit class weiter
td.16 {font-size:16px;}
dann haben alle td arial+14px und td.16 arial+16px
nach dem prinzip sollte es gehen

stefan

[Stefan Hoba]

hi,

ich hoffe ich habe die frage richtig verstanden.
das sollte gehen, z.B.
td {font-size:14px;
    font-family:arial, sans-serif;
   }
und dann mit class weiter
td.16 {font-size:16px;}
dann haben alle td arial+14px und td.16 arial+16px
nach dem prinzip sollte es gehen

stefan

So einfach verhält es sich leider nicht. Ich möchte innerhalb von selbstdefinierten Elementen weitervererben, ungefähr so:

.vorlage {
  font-family:Arial;
  font-weight:bold;
  margin-top:12px;
  ...
}

Dieses Style wird selbst nie eingesetzt, dient aber als Vorlage für weitere Styles:

.speziell1 extends .vorlage {
  font-size:24pt;
}

.speziell2 extends .vorlage {
  font-size:18pt;
}

Trotzdem Vielen Dank für die Hinweise, ich werde weiterprobieren.

Stefan

[Swen]

Moin

So einfach verhält es sich leider nicht. Ich möchte innerhalb von

selbstdefinierten Elementen weitervererben
^^^^^^^^^^^^^^^^^^^^^^^^^^^

Das geht erst in XML :-)

ungefähr so:

[Klasse in Klasse]

Nein, das geht nicht. Du kannst nur ein Klasse je Selektor definieren. Das ist übrgiens auch genau beschrieben: http://www.w3.org/TR/REC-CSS1#class-as-selector "Only one class can be specified per selector. 'P.pastoral.marine' is therefore an invalid selector in CSS1."

Mehr ist auch nicht nötig, da dir das Cascadierende von CSS schon zuvor (also beginnend mit dem Element body) genügend Freiraum gibt http://www.w3.org/TR/REC-CSS1#cascading-order.

In deinen Beispiel könntest du also die von gewünschten "stetigen" Merkmale für das Element BODY und/oder P definieren und anschließend mit .kleiner oder p.groesser oder ähnlichem arbeiten.

Viele Grüße

Swen

[stefan(klein geschrieben)]

hi swen,

In deinen Beispiel könntest du also die von gewünschten "stetigen" Merkmale für das Element BODY und/oder P definieren und anschließend mit .kleiner oder p.groesser oder ähnlichem arbeiten.

vorsichtig, ns will das nicht. gebe in body eine schriftart an und du hast sie nur im body aber nicht in <td> (ich weiss <td> steht im body aber ns will trotzdenm nicht)

korrigiere mich wenn ich mich irre, aber das habe ich laufend.

schönen gruß
stefan

[Swen]

Moin

korrigiere mich wenn ich mich irre, aber das habe ich laufend.

Ich sprach von der Spec - also, wie es sein soll - nicht von der schnöden Realität - also was Browser oder Programme von Netscape daraus machen :-) . Denn dann würde ich sohttp://www.teamone.de/selfaktuell/forum/messages/92532.html antworten

Viele Grüße

Swen

[Thomas J.S.]

Hallo Swen!

»»  [Klasse in Klasse]

Nein, das geht nicht.

Das geht!

Das ist übrgiens auch genau beschrieben: http://www.w3.org/TR/REC-CSS1#class-as-selector "Only one class can be specified per selector. 'P.pastoral.marine' is therefore an invalid selector in CSS1."

CSS1! Eben!

Aber nicht mehr in CSS2

http://www.w3.org/TR/REC-CSS2/selector.html#class-html

Allerdings:

<p class="green bold">güner und fetter text</p> wird nur vom IE5 verstanden.

Grüße
Thomas

[Swen]

Moin,

Das geht!

Aber nicht mehr in CSS2

Okay, Überzeugt, dass das _geht_. Ich sollte wohl mehr Zug fahren :-) Da habe ich etwas dazugelernt.

Ob das aber sinnvoll ist, wage ich gleichwohl zu bezweifeln: Mit CSS 2 bewegen wir uns doch in Bereiche hinein, wo "normalerweise" nur "wohlgeformte" Dokumente auf ihre Darstellungform warten. (Ich weiß, das hört sich elitär an, aber seinen wir doch mal ehrlich: CSS2/3, XHTML etc werden doch nicht für den Homepagebastler entwickelt - in diesem Bereich werden wir auch noch 10 Jahren mit HTML 3.2 und ein wenig CSS 1 auskommen können)
Einfach nutzbare multiple Gestaltungmöglichkeiten sind doch wieder nur ein _Einfallstor_ in Markup a la Word 95, wo das böse Erwachen immer erst dann kommt, wenn man beim Versuch, ein Inhaltsverzeichis für seine Diplomarbeit zu generieren, merkt, dass diese komischen Formatvorlagen irgendwie doch einen Sinn haben.

Andersherum hätte ich es noch verstanden: In CSS 1 wird es "für die private Homepage" ermöglicht, mit <p class="groesser gruener fetter kursiver"> (und damit auch mit gewisser Ignoranz gegenüber dem M in HTML) die "persönliche Überschrift" zu gestalten. Mit CSS 2 hätte man dann aber bitte den Weg in die "richtige" Richtung gehen können.

<p class="green bold">güner und fetter text</p> wird nur vom IE5 verstanden.

Irgendwie ja konsequent, dass MS so etwas sofort unterstützt ;-))

Viel Spaß

Swen

[Thomas J.S.]

Hallo Swen!

Ich weiss du bekommst es hier nicht mehr mit ... aber:

Mit CSS 2 hätte man dann aber bitte den Weg in die "richtige" Richtung gehen können.

»»

Sie sind gegangen.

denn wie ist es damit?
.monolog {
font-family:Times;
font-size:10pt;
}
.dialog {
font-family:Arial;
font-size:14pt;
}
.mann {
color:blue;
}
.frau {
color:red;
}

<p class="dialog mann">...</p>
<p class="dialog frau">...</p>
<p class="monolog mann">...</p>
<p class="monolog frau">...</p>

und das ist nr ein sehr sehr einfaches Beispiel, was man alles mit Verschachtelung von Klassen in CSS2 erreichen könnte.

Grüße
Thomas

[Thomas J.S.]

Hallo Stefan!

So einfach verhält es sich leider nicht. Ich möchte innerhalb von selbstdefinierten Elementen weitervererben, ungefähr so:

.vorlage {
  font-family:Arial;
  font-weight:bold;
  margin-top:12px;
  ...
}

Dieses Style wird selbst nie eingesetzt, dient aber als Vorlage für weitere Styles:

.speziell1 extends .vorlage {
  font-size:24pt;
}

.speziell2 extends .vorlage {
  font-size:18pt;
}

Umgekehrt würde es gehen:

.vorlage {
  font-family:Arial;
  font-weight:bold;
  margin-top:12px;
  ...
}

.vorlage .speziell {
font-size:18pt;
}

Du muss aber die Klasse .vorlage irgendwo bei einem übergeordneten Element anwenden sonst wird die Verschachtelung
.vorlage .speziell  nie gültig werden können.

Grüße
Thomas

[Swen]

Moin

sei vorsichtig mit zu vielen Klassen. Definiere die stetig bleibenden Eingenschaften besser am Element. Schau auch mal hier nach: <../../tdbb.htm#a3>.

Falls du Problem hast, poste deinen code oder stell ihn online.

Viele Grüße

Swen