CSS Geltungsbereich eingrenzen

[Sebastian Lorenz]

Hallo,

ich habe hier eine Kundenwebseite mit einem CMS-System.
Der Kunde wünscht nun, dass Links im mittleren Seitenbereich unterstrichen dargestellt werden sollen.
In den Infoleisten vor UND nach diesem Bereich sollen diese nur farblich gekennzeichnet werden.

Wir kann ich den Geltungsbereich für .link , .hover ... so festlegen, dass diese Vorgaben sich nur auf einen bestimmenten Seitenteil auswirken ?

Ich stelle mir so etwas vor, was aber nicht funktioniert:

CSS: .link: fett, farbig, keine Unterstreichung
Navigation

CSS: .link: nicht-fett, farbig, mit Unterstreichung
Haupttext der Seite

CSS: .link: fett, farbig, keine Unterstreichung
Infoleiste

Vielen Dank für eure Tipps !

Bye,
Sebastian

[sear]

hallo sebastian!

ich weiss nicht, ob man den gestaltungsbereich als solches eingrenzen kann.

was du aber sicher tun kannst, ist verschiedene klassen vergeben; das würde dann im css-file etwa so aussehen:

.infoleiste, a:link{
settings
}

.haupttext, a:link{
settings
}

usw.

bei den links müsste dann die klasse angegeben werden:

<a href="#" class="infoleiste">

weiss jetzt aber nicht, ob du das aus dem CMS herausmachen kannst!

gruss
sear >>

[wahsaga]

hi,

.infoleiste, a:link{
settings
}

.haupttext, a:link{
settings
}

falsch. da du für a:link zwei mal etwas definierst, überschreibt die zweite definition die erste (bzw. nicht konkurrierende angaben aus beiden werden zusammengemixt.

a.klasse1:link {...}
a.klasse1:hover {...}
a.klasse2:link {...}
a.klasse2:hover {...}

wäre eine möglichkeit.

eine ander wäre, per klasse oder ID ein umgebendes element anzusprechen, so dass man bei den links auf eigene klassen verzichten kann:

#menu a:hover {...}
#inhalt a:hover {...}

<div id="menu">
<a ...>
<a ...>
</div>

<div id="inhalt">
<a ...>
<a ...>
</div>

gruss,
wahsaga

[Sebastian Lorenz]

Hallo,

vielen Dank erst ein mal. So ganz habe ich das aber noch nicht verstanden. Hier mal etwas Quelltext:

Im Header:
<link href="styles.css" rel="stylesheet" type="text/css">

Im Dokument:
[...]
<th align="left" valign="top" class="maintext" scope="col">
<p><font color="#990000" size="4" face="Verdana, Arial, Helvetica, sans-serif"><strong><?=$htmltitel?></strong></font></p>
<?=$htmltext?></th>
[...]

styles.css:
[...]
a:link {
 text-decoration: none;
 color: #8C2D27;
}
.maintext {
 font: normal 10px Verdana, Arial, Helvetica, sans-serif;
 color: #000000;
 a: text-decoration: underline;
}
[...]

Die Zeile
a: text-decoration: underline;
habe ich dort gerade eingefügt. Allerdings hat dies keine Auswirkungen. Es reicht vollkommen aus, wenn alle Links innerhalb des .maintext unterstrichen werden.
Durch den MS-HTML-Editor ist es leider unmöglich, sämlichten <a>'s eine Klasse zuzuweisen.

Habt Ihr noch ein mal einen Tipp ?

Bye,
Sebastian

[wahsaga]

hi,

.maintext {
font: normal 10px Verdana, Arial, Helvetica, sans-serif;
color: #000000;
a: text-decoration: underline;
}
[...]

Die Zeile
a: text-decoration: underline;
habe ich dort gerade eingefügt. Allerdings hat dies keine Auswirkungen.

ja himmel, das wäre ja auch noch schöner ...

woher hast du denn diesen unfug? das ist doch alles andere als gültige CSS-syntax.

Es reicht vollkommen aus, wenn alle Links innerhalb des .maintext unterstrichen werden.

ja, dann mach doch das, was ich dir vorgeschlagen habe:

a:link { /*formatierungen, die für alle links gelten sollen*/ }

.maintext a:link { /*formatierungen, die nur für diese links gelten sollen. formatierungen, die gleich wie bei a:link sein sollen, brauchen nicht erneut notiert zu werden, da sie von dort vererbt werden. anders lauten formatierungen müssen hier explizit überschrieben werden*/ }

Durch den MS-HTML-Editor ist es leider unmöglich, sämlichten <a>'s eine Klasse zuzuweisen.

man soll ja html-seiten auch noch in anderen programmen als solchen käse-programmen schreiben können ... hab ich jedenfalls gehört.

gruss,
wahsaga

[Sebastian Lorenz]

Hallöle mal wieder

ja, dann mach doch das, was ich dir vorgeschlagen habe:

a:link { /*formatierungen, die für alle links gelten sollen*/ }

.maintext a:link { /*formatierungen, die nur für diese links gelten sollen. formatierungen, die gleich wie bei a:link sein sollen, brauchen nicht erneut notiert zu werden, da sie von dort vererbt werden. anders lauten formatierungen müssen hier explizit überschrieben werden*/ }

OK, ich glaube, ich hab's kapiert. Es funktioniert nun auf jeden Fall.

Durch den MS-HTML-Editor ist es leider unmöglich, sämlichten <a>'s eine Klasse zuzuweisen.

man soll ja html-seiten auch noch in anderen programmen als solchen käse-programmen schreiben können ... hab ich jedenfalls gehört.

Geschrieben wird der ganze Spaß im Dreamweaver. Aber im Content-Management-System, wo der Endkunde ohne Software arbeiten soll, ist das Ding von MS leider das einzige, was halbwechs gut funktioniert und erweiterbar ist.

Vielen Dank noch ein mal.

Bye,
Sebastian