Dies ist eine statische Kopie unseres alten Forums. Es sind keine Interaktionen möglich.
This is a static copy of our old forum. Interactions are not possible.

chefstatist

Trainee

  • "chefstatist" is male
  • "chefstatist" started this thread

Posts: 57

Date of registration: Jan 9th 2002

Location: Hannover-Nordstadt

1

Friday, January 7th 2005, 5:59pm

CSS Inline Styles mit Pseudo-Klassen

Hallo,

ich versuche mich gerade daran, eine Seite aus einem Typo3-CMS mit CSS nachzubauen. Aus bestimmten Gründen wäre es günstig, dabei Inline Styles der folgenden Art zu benutzen:

Source code

 
1
2
3
4
5
6

<a href="http://www.w3.org/"
          style="{color: #900}
          :link {background: #ff0}
          :visited {background: #fff}
          :hover {outline: thin red solid}
          :active {background: #00f}">...</a>


(Quelle: http://www.w3.org/TR/css-style-attr)

Leider zeigt das weder in Gecko noch im IE irgendeine Wirkung.

Es scheint also zur Zeit noch nicht implementiert.

Kennt jemand einen Workaround oder muss man das so hinnehmen?

Grüße & schönes Wochenende,

Fabian
  • Send private message

Markus

the one and only Unterstrich!

Posts: 2,571

Date of registration: Oct 9th 2003

2

Friday, January 7th 2005, 8:57pm

Falls es dir hilft, eine andere Möglichkeit html mit css direkt zu formatieren:

Bsp:

Source code

 
1
2
3
4
5
6
7
8

<a href="http://www.w3.org/"
   style="background-color:#808040; 
      color:#D8FD02;
      font-family:'Century Schoolbook',serif;
      font-size:24pt; 
      letter-spacing:3px;
      padding:40px; 
      border:double #D8FD02 4px;">...</a>
Charmant sein? Hab ich längst aufgegeben. Glaubt mir doch eh keiner...
  • Send private message

chefstatist

Trainee

  • "chefstatist" is male
  • "chefstatist" started this thread

Posts: 57

Date of registration: Jan 9th 2002

Location: Hannover-Nordstadt

3

Friday, January 7th 2005, 9:28pm

hab eine Möglichkeit gefunden, geht zwar eher in die Richtung 'dreckiger Hack', funktioniert aber prächtig:

Source code

 
1
2
3
4

<td onmouseover="this.style.backgroundColor='#E5E5E5';" 
onmouseout="this.style.backgroundColor='#F2F2F2';">
<a href="http://www.w3.org/">...</a>
</td>
  • Send private message

Joachim

Guru

  • "Joachim" is male

Posts: 2,863

Date of registration: Dec 11th 2001

Location: Hämelerwald

Occupation: Wissenschaftlicher Mitarbeiter (Forschungszentrum L3S, TU Braunschweig)

4

Friday, January 7th 2005, 10:32pm

RE: CSS Inline Styles mit Pseudo-Klassen

Quoted

Original von chefstatist
ich versuche mich gerade daran, eine Seite aus einem Typo3-CMS mit CSS nachzubauen. Aus bestimmten Gründen wäre es günstig, dabei Inline Styles der folgenden Art zu benutzen:
Diese "bestimmten Gründe" würden mich interessieren. Inline-Styles sind nämlich nie günstig, da sie die Idee der Trennung von Inhalt und Darstellung untergraben.
The purpose of computing is insight, not numbers.
– Richard Hamming, 1962
  • Send private message

chefstatist

Trainee

  • "chefstatist" is male
  • "chefstatist" started this thread

Posts: 57

Date of registration: Jan 9th 2002

Location: Hannover-Nordstadt

5

Monday, January 10th 2005, 12:43pm

Hallo Joachim,

die Seite ist organisiert in verschiedene Bereiche, die mit unterschiedlichen Farben für das Menü und den Contentbereich versehen sind.

Mein erster Ansatz war, dafür jeweils CSS-Klassen zu definieren. Mit den :Hover, :Link etc. Klassen war das jedoch schnell unübersichtlich.

Jetzt werden die gemeinsamen Eigenschaften in CSS-Klassen definiert und die Farben etc. werden über Inline-Styles in den Extension-Templates der einzelnen Bereiche überschrieben.

Mir ist leider keine andere Möglichkeit dafür eingefallen; da das ganze in einem Content-Management-System stattfindet ist der Content dennoch getrennt von der Auszeichnung, die ja in den Templates abgelegt ist.

Beste Grüße,

Fabian

This post has been edited 1 times, last edit by "chefstatist" (Jan 10th 2005, 12:44pm)

  • Send private message

Joachim

Guru

  • "Joachim" is male

Posts: 2,863

Date of registration: Dec 11th 2001

Location: Hämelerwald

Occupation: Wissenschaftlicher Mitarbeiter (Forschungszentrum L3S, TU Braunschweig)

6

Monday, January 10th 2005, 4:00pm

Quoted

Original von chefstatist
die Seite ist organisiert in verschiedene Bereiche, die mit unterschiedlichen Farben für das Menü und den Contentbereich versehen sind.

Mein erster Ansatz war, dafür jeweils CSS-Klassen zu definieren. Mit den :Hover, :Link etc. Klassen war das jedoch schnell unübersichtlich.
Für jeden Bereich der Site ein eigenes Stylesheet erstellen, das nur die Klassen enthält, die unterschiedlich sind. Dann je nach Bereich der Site das entsprechende Stylesheet einbinden. Die Style-Angaben, die in allen Bereichen gleich sind, kommen in ein gemeinsames Stylesheet, das zusätzlich eingebunden wird.

Wenn man dabei die Regel beachtet, seine Pseudoklassen (oder IDs) gemäß ihrer Bedeutung im Kontext (und nicht gemäß der damit erzeugten Darstellung) zu benennen, ist das auch gar nicht mal so unübersichtlich:

Also statt

Source code

 
1

<p class="rot">Ein wichtiger Absatz.</p>

besser

Source code

 
1

<p class="wichtig">Ein wichtiger Absatz.</p>


Quoted

Mir ist leider keine andere Möglichkeit dafür eingefallen; da das ganze in einem Content-Management-System stattfindet ist der Content dennoch getrennt von der Auszeichnung, die ja in den Templates abgelegt ist.
Typo3? Das ermöglicht leider solche Sachen ...
The purpose of computing is insight, not numbers.
– Richard Hamming, 1962

This post has been edited 2 times, last edit by "Joachim" (Jan 10th 2005, 4:05pm)

  • Send private message

chefstatist

Trainee

  • "chefstatist" is male
  • "chefstatist" started this thread

Posts: 57

Date of registration: Jan 9th 2002

Location: Hannover-Nordstadt

7

Monday, January 10th 2005, 5:09pm

Quoted

Für jeden Bereich der Site ein eigenes Stylesheet erstellen, das nur die Klassen enthält, die unterschiedlich sind. Dann je nach Bereich der Site das entsprechende Stylesheet einbinden. Die Style-Angaben, die in allen Bereichen gleich sind, kommen in ein gemeinsames Stylesheet, das zusätzlich eingebunden wird.


Ja, das habe ich auch überlegt. Allerdings kam mir das letztendlich unübersichtlicher vor, weil die Auszeichnung an zwei verschiedenen Stellen gepflegt werden müsste (einmal im Extension-Template, einmal in den .CSS-Dateien für den jeweiligen Bereich).
Technisch sauberer wäre es aber bestimmt.

Quoted

Typo3? Das ermöglicht leider solche Sachen ...


Wo siehst Du denn den großen Nachteil bei dieser Art der Implementierung?
(Und ist es nicht eigentlich ganz hilfreich, solche Sachen zur Not umsetzen zu können? Saubere Sachen kann man ja auch erstellen...)
  • Send private message

Joachim

Guru

  • "Joachim" is male

Posts: 2,863

Date of registration: Dec 11th 2001

Location: Hämelerwald

Occupation: Wissenschaftlicher Mitarbeiter (Forschungszentrum L3S, TU Braunschweig)

8

Monday, January 10th 2005, 5:26pm

Quoted

Original von chefstatist

Quoted

Typo3? Das ermöglicht leider solche Sachen ...


Wo siehst Du denn den großen Nachteil bei dieser Art der Implementierung?
Den großen Nachteil gibt es nicht, es sind aber viele kleine Dinge, die mich stören.

"Philosophische" Gründe:
  • Eine derartige Lösung widerspricht der Idee von HTML/CSS -- zumindest, was den Quelltext angeht. Das Problem löst Typo3 zwar auf einer anderen Ebene, aber wozu muß man erst eine solche Ebene schaffen, wenn sich das Problem auch direkt vermeiden ließe?
  • Identische Style-Angaben tauchen mehrfach im HTML-Dokument oder gar in verschiedenen HTML-Dokumenten auf. Dies ist eine vermeidbare Redundanz.


"Praktische" Gründe:
  • Die HTML-Dokumente werden größer, es ist kein Caching der Style-Angaben möglich, wenn mehrere Seiten gleiche Angaben verwenden.
  • Will man später die Style-Angaben auf andere Medien ausweiten (im Sinne von http://www.w3.org/TR/CSS21/media.html), so macht dieser Ansatz Probleme. Hier müßte Typo3 wieder selber Funktionalität implementieren, die eigentlich auf Stylesheet-Ebene liegt und daher in einem CMS nicht erforderlich ist.
  • Das Debugging ist schwer, wenn ein Teil der Style-Angaben in Stylesheets und ein anderer Teil in Inline-Angaben steckt.





Quoted

(Und ist es nicht eigentlich ganz hilfreich, solche Sachen zur Not umsetzen zu können? Saubere Sachen kann man ja auch erstellen...)
Das Problem dabei ist leider, daß man dann dazu neigt, immer nur unsauber zu arbeiten, ganz einfach weil es schneller geht. ("Erstmal machen wir es unsauber, damit es funktioniert. Später machen wir es dann richtig ..." -- später = nie)
The purpose of computing is insight, not numbers.
– Richard Hamming, 1962
  • Send private message

chefstatist

Trainee

  • "chefstatist" is male
  • "chefstatist" started this thread

Posts: 57

Date of registration: Jan 9th 2002

Location: Hannover-Nordstadt

9

Monday, January 10th 2005, 9:36pm

Quoted

Das Problem dabei ist leider, daß man dann dazu neigt, immer nur unsauber zu arbeiten, ganz einfach weil es schneller geht. ("Erstmal machen wir es unsauber, damit es funktioniert. Später machen wir es dann richtig ..." -- später = nie)


da ist was dran :-)
  • Send private message