BlackBoard » Design, Programmierung & Entwicklung » Webdesign » CSS Drei verschiedene Linkformatierungen » Hallo Gast [Anmelden|Registrieren]
Letzter Beitrag | Erster ungelesener Beitrag Druckvorschau | An Freund senden | Thema zu Favoriten hinzufügen
Neues Thema erstellen Antwort erstellen
Zum Ende der Seite springen Drei verschiedene Linkformatierungen
Autor
Beitrag « Vorheriges Thema | Nächstes Thema »
stabo stabo ist männlich
Leo


images/avatars/avatar-1681.jpg

Dabei seit: 14.10.2001
Beiträge: 132
Herkunft: Nähe Lübeck

Drei verschiedene Linkformatierungen       Zum Anfang der Seite springen

moin

Wie der Titel schon sagt möchte ich drei verschiede Linkformatierungen im meiner Seite verwenden.

Imo habe ich zwei davon.
Das habe ich einmal über die Option Pseudoformate und einmal über "#id" gemacht.

So wurde alles auch richtig angezeigt.

Die "#id" Version wird mir nach w3c als Fehler ausgegeben, als ich also versucht habe es in eine Classdefinition zu packen, haben sich die beiden Formate gegenseitig behindert.

Daher meine Frage wie kann dieses Problem lösen?

__________________
MfG StaboFreude
Zitat:
Wie wenig wir wissen, erkennen wir, wenn unserer Kinder anfangen zu fragen.

29.01.2005 13:50 stabo ist offline E-Mail an stabo senden Homepage von stabo Beiträge von stabo suchen
COCYHOK COCYHOK ist männlich
Verunsicherungsmakler


images/avatars/avatar-2037.png

Dabei seit: 04.10.2003
Beiträge: 1.079
Herkunft: CCCP

      Zum Anfang der Seite springen

Was sind denn Pseudoformate? Wär schön, wenn du mal einen Codeabschnitt posten würdest.

__________________
Es ist eine Frage, ob wir nicht, wenn wir einen Mörder rädern, grade in den Fehler des Kindes verfallen, das den Stuhl schlägt, an dem es sich stößt.
Georg Christoph Lichtenberg, 18. Jahrhundert
29.01.2005 14:11 COCYHOK ist offline E-Mail an COCYHOK senden Homepage von COCYHOK Beiträge von COCYHOK suchen
stabo stabo ist männlich
Leo


images/avatars/avatar-1681.jpg

Dabei seit: 14.10.2001
Beiträge: 132
Herkunft: Nähe Lübeck

Themenstarter Thema begonnen von stabo
      Zum Anfang der Seite springen

moin

Ich hoffe ihr könnt damit was anfangen.
Mit Pseudoformate meine ich die Linkformartierung "a:/ a:Link" usw.

Quelltext aus dem Head Bereich
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
<style type="text/css">
<!-- 
.bg {background-image: url(images/balken.gif);}

#menu1 a {display: block; background-image: url(images/back_button.jpg); color:silver; text-decoration:none ;font-family:verdana, sans-serif; font-size: 10pt;width:160px;
padding-left: 4px; padding-bottom: 4px;   padding-top: 4px;margin: 0px auto;border:solid 1px #89a9b8;}

#menu1 a:visited{ background-image:url(images/back_button.jpg);color:silver;text-decoration:none;font-family:verdana, sans-serif; font-size: 10pt;width:160px;
padding-left: 4px; padding-bottom: 4px;   padding-top: 4px;margin: 0px auto;border:solid 1px #89a9b8;}

#menu1 a:active{background-image: url(images/back_button.jpg); color:white;text-decoration:none;font-family:verdana, sans-serif; font-size: 10pt;width:160px;
padding-left: 4px; padding-bottom: 4px;   padding-top: 4px;margin: 0px auto;border:solid 1px #89a9b8;}

#menu1 a:hover {background-color:#89a9b8;background-image: url(images/back_button_b.jpg);color: white; text-decoration:none ;font-family:verdana, sans-serif; font-size: 10pt;width:160px;
padding-left: 4px; padding-bottom: 4px;   padding-top: 4px;margin: 0px auto;border:solid 1px #999999;}
--></style>


textbereich aus dem Body
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
<table bgcolor="black" border="0px" cellpadding="0px" cellspacing="0px" width="160px">
  <tr>
   <td valign="top">
<table width="160px"  border="0px" cellpadding="0px" cellspacing="1px" id="menu1">
  <tr>
   <td bgcolor="#4E6F81" width="160px" height="20px" style="padding:4px" class="bg">.::&nbsp;Navigation&nbsp;::.</td>
  </tr>

  <tr>
   <td width="160px"><a href="index.html">&nbsp;&nbsp;&raquo;&nbsp;Home&nbsp;&laquo;</a></td>
  </tr>
  <tr>


und noch Text aus der css datei
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
/* allgemeine links */

a:link{ color: white; text-decoration:underline; ;font-family: verdana,sans-serif; font-size: 10pt;border:solid 0px #89a9b8;padding:1px }

a:visited{color: white;text-decoration:underline;font-family: verdana,sans-serif; font-size: 10pt;border:solid 0px #89a9b8;padding:1px }

a:active{ color:white;text-decoration:underline;font-family: verdana,sans-serif; font-size: 10pt;border:solid 0px #89a9b8;padding:1px  }

a:hover{ color: #808080;background-color:white;  text-decoration:none;font-family: verdana,sans-serif; font-size: 10pt;border:solid 1px black;padding:1px  }


__________________
MfG StaboFreude
Zitat:
Wie wenig wir wissen, erkennen wir, wenn unserer Kinder anfangen zu fragen.

29.01.2005 14:23 stabo ist offline E-Mail an stabo senden Homepage von stabo Beiträge von stabo suchen
LX LX ist männlich
El Comandante en Jefe


images/avatars/avatar-2290.gif

Dabei seit: 25.11.2001
Beiträge: 5.372
Herkunft: Berliner Bronx

Achtung       Zum Anfang der Seite springen

Also IDs sind in HTML eineindeutig, sprich es darf nur genau ein Element mit derselben ID geben auf der Seite. Wenn du also eine Gruppe von Links gleich gestalten willst, kommst du an einer Klasse nicht vorbei.

Du kannst übrigens auch in einer Klasse noch die Pseudoformate verwenden

code:
1:
a.whatever:hover { text-decoration: underline; }


Oder falls eine Gruppe von Links nur in einem bestimmten Teil deiner Seite vorkommt, beispielsweise in derselben Tabellenzelle, kannst du über die ID des übergeordneten Elements gehen:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
<style type="text/css">
#nav a:link { ...}
#nav a:hover { ... }
</style>
[...]
<table>
<tr>
  <td id="nav">
    <a href="...">klick mich blau</a>
    <a href="...">nicht so dolle</a>
  </td>
</tr>
</table>


Entdecke die Möglischgeiten Augenzwinkern

__________________
JS-Games.de - Misled Scripting Skills Gone Mad | Meine Filmkritiken | Urban Photography
Kommt mal in den IRC-Channel: irc.eu.freenode.net | Port 6667 | #blackboard

"Ever tried. Ever failed. No matter.
Try again. Fail again. Fail better."
- Samuel Beckett

29.01.2005 14:32 LX ist offline E-Mail an LX senden Homepage von LX Beiträge von LX suchen
stabo stabo ist männlich
Leo


images/avatars/avatar-1681.jpg

Dabei seit: 14.10.2001
Beiträge: 132
Herkunft: Nähe Lübeck

Themenstarter Thema begonnen von stabo
      Zum Anfang der Seite springen

moin

@LX

Zitat:

Oder falls eine Gruppe von Links nur in einem bestimmten Teil deiner Seite vorkommt, beispielsweise in derselben Tabellenzelle, kannst du über die ID des übergeordneten Elements gehen:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
<style type="text/css">
#nav a:link { ...}
#nav a:hover { ... }
</style>
[...]
<table>
<tr>
  <td id="nav">
    <a href="...">klick mich blau</a>
    <a href="...">nicht so dolle</a>
  </td>
</tr>
</table>



So ist es im moment ja, aber das wird mir beim w3c test angekreidet mit folgender Fehlermeldung:
Zitat:
An "id" is a unique identifier. Each time this attribute is used in a document it must have a different value. If you are using this attribute as a hock for style sheets it may be more appropriate to use classes (which group elements) than id (which are used to identify exactly one element).


Misel war gestern so freundlich, und hatte sie schon mal ins deutsche gebracht.

Ich habe es auch mal mit deinem ersten Code versucht, aber ohne Erfolg.

Hier mal die Seite inklusiver Cssdatei mit angeheftet :click

__________________
MfG StaboFreude
Zitat:
Wie wenig wir wissen, erkennen wir, wenn unserer Kinder anfangen zu fragen.

29.01.2005 21:21 stabo ist offline E-Mail an stabo senden Homepage von stabo Beiträge von stabo suchen
Misel Misel ist männlich
Hüter des Kitkat


images/avatars/avatar-2084.png

Dabei seit: 02.11.2002
Beiträge: 1.203
Herkunft: live://home.berlin.d e

      Zum Anfang der Seite springen

Stabo: Erklär mal genauer, was für Effekte Du haben willst.

Der Code macht genau das, was in der CSS steht großes Grinsen Sogar im IE5

__________________
LAUFT! Ich spiele KILLERSPIELE!
30.01.2005 00:15 Misel ist offline E-Mail an Misel senden Homepage von Misel Beiträge von Misel suchen
stabo stabo ist männlich
Leo


images/avatars/avatar-1681.jpg

Dabei seit: 14.10.2001
Beiträge: 132
Herkunft: Nähe Lübeck

Themenstarter Thema begonnen von stabo
      Zum Anfang der Seite springen

moin

Zitat:
Der Code macht genau das, was in der CSS steht großes Grinsen Sogar im IE5


Ja das ist mir klar das er das macht .
Nur w3c hat was gegen den

code:
1:
2:
3:
4:
5:
6:
7:
<table width="160px"  border="0px" cellpadding="0px" cellspacing="1px" id="menu1">
  <tr>
   <td bgcolor="#4E6F81" width="160px" height="20px" style="padding:4px" class="bg">.::&nbsp;Navigation&nbsp;::.</td>
  </tr>

  <tr>
   <td width="160px"><a href="index.html">&nbsp;&nbsp;&raquo;&nbsp;Home&nbsp;&laquo;</a></td>


und das möchte ich beseitigen.

Edit: Es ist jetzt 01:42Uhr und ich habe es doch noch hinbekommen.
der erste code von Lx war Ausschlaggebend. Ich hatte nur die Classdatei falsch eingebunden.

Danke für eure Hilfe

__________________
MfG StaboFreude
Zitat:
Wie wenig wir wissen, erkennen wir, wenn unserer Kinder anfangen zu fragen.

Dieser Beitrag wurde 1 mal editiert, zum letzten Mal von stabo: 30.01.2005 01:43.

30.01.2005 00:23 stabo ist offline E-Mail an stabo senden Homepage von stabo Beiträge von stabo suchen
Baumstruktur | Brettstruktur
Gehe zu:
Neues Thema erstellen Antwort erstellen
BlackBoard » Design, Programmierung & Entwicklung » Webdesign » CSS Drei verschiedene Linkformatierungen

Forensoftware: Burning Board 2.3.6, entwickelt von WoltLab GmbH