text-decoration

[Nik]

Hallo

wie bekomme ich für jeden Textlink eine andere Farbe hin?

a:link    { color: #FF00FF; text-decoration: none}
a:visited { color: #00FFFF; text-decoration: none}
a:hover   { color: #FF0000; text-decoration: none}

zeigt alle Links gleich. ich möchte jedoch jeden Lin in einer anderen Farbe haben.

So würde das ganze in der html Seite aussehen:

<p><span class="1"><a href="http://www.domain-1.de">Link 1</a></span></p>
<p><span class="2"><a href="http://www.domain-1.de">Link 2</a></span></p>
<p><span class="3"><a href="http://www.domain-1.de">Link 3</a></span></p>
<p><span class="4"><a href="http://www.domain-1.de">Link 4</a></span></p>

[Gunnar Bittersmann]

@@Nik:

nuqneH

wie bekomme ich für jeden Textlink eine andere Farbe hin?

Was hat die Farbe mit 'text-decoration' zu tun?

ich möchte jedoch jeden Lin in einer anderen Farbe haben.

https://forum.selfhtml.org/?t=194570&m=1301350 Und frag bitte nicht, was die Farbe mit Bullet-Grafik zu tun hat. ;-)

So würde das ganze in der html Seite aussehen:

<p><span class="1"><a href="http://www.domain-1.de">Link 1</a></span></p>
<p><span class="2"><a href="http://www.domain-1.de">Link 2</a></span></p>
<p><span class="3"><a href="http://www.domain-1.de">Link 3</a></span></p>
<p><span class="4"><a href="http://www.domain-1.de">Link 4</a></span></p>

Nein. Eher so:

<ul>  
  <li><a id="link1" href="http://example.net">Link 1</a></li>  
  <li><a id="link2" href="http://example.net">Link 2</a></li>  
  <li><a id="link3" href="http://example.net">Link 3</a></li>  
  <li><a id="link4" href="http://example.net">Link 4</a></li>  
</ul>

Ein Navigationsmenü ist eine _Liste_ von Links.

<Gebetsmühle>Verwende für Beispieldomains example.com, example.net, example.org oder auch foo.example, foo.invalid. [RFC2606] NIE Namen angeben, die wirklich existieren (können)! (Man weiß nie, was sich für Inhalt dahinter verbirgt.)</Gebetsmühle>

Qapla'

[apsel]

Om nah hoo pez nyeetz,

<Gebetsmühle> ... </Gebetsmühle>

Ich frag mich gerade, wie das wohl in html aussehen könnte ;-)

Matthias

[EKKi]

Mahlzeit Nik,

wie bekomme ich für jeden Textlink eine andere Farbe hin?

Indem Du für jeden Textlink eine andere Farbe definierst.

a:link    { color: #FF00FF; text-decoration: none}
a:visited { color: #00FFFF; text-decoration: none}
a:hover   { color: #FF0000; text-decoration: none}

zeigt alle Links gleich.

Natürlich. Genau das hast Du damit ja auch festgelegt.

ich möchte jedoch jeden Lin in einer anderen Farbe haben.

Dann musst Du für jeden Link eine andere Farbe angeben.

So würde das ganze in der html Seite aussehen:

<p><span class="1"><a href="http://www.domain-1.de">Link 1</a></span></p>
<p><span class="2"><a href="http://www.domain-1.de">Link 2</a></span></p>
<p><span class="3"><a href="http://www.domain-1.de">Link 3</a></span></p>
<p><span class="4"><a href="http://www.domain-1.de">Link 4</a></span></p>

• Du solltest für Beispieldomains die entsprechend reservierten Namen und nicht eventuell real existierende benutzen.

• Du solltest von rein numerischen Klassennamen Abstand nehmen und halten.

• Du solltest eine offensichtliche Liste auch als solche auszeichnen.

<style type="text/css">[code lang=css]  
  
li.link_1 a {  
  color: red;  
}  
  
li.link_2 a {  
  color: green;  
}  
  
li.link_3 a {  
  color: blue;  
}  
  
li.link_4 a {  
  color: yellow;  
}

</style>
[...]
<ul>
  <li class="link_1"><a href="http://www.domain_1.example">Link 1</a></li>
  <li class="link_2"><a href="http://www.domain_2.example">Link 2</a></li>
  <li class="link_3"><a href="http://www.domain_3.example">Link 3</a></li>
  <li class="link_4"><a href="http://www.domain_4.example">Link 4</a></li>
</ul>[/code]

MfG,
EKKi

[Gunnar Bittersmann]

@@EKKi:

nuqneH

• Du solltest für Beispieldomains die entsprechend reservierten Namen und nicht eventuell real existierende benutzen.
• Du solltest eine offensichtliche Liste auch als solche auszeichnen.

Erster! ;-)

Qapla'

[EKKi]

Mahlzeit Gunnar Bittersmann,

• Du solltest für Beispieldomains die entsprechend reservierten Namen und nicht eventuell real existierende benutzen.
• Du solltest eine offensichtliche Liste auch als solche auszeichnen.

Erster! ;-)

P-ö-h! ;-)

MfG,
EKKi

[Nik]

• Du solltest für Beispieldomains die entsprechend reservierten Namen und nicht eventuell real existierende benutzen.

Ups, gibt's sowas wirklich?!

Deine Lösung bietet keine text-decoration bei visited und hover!!

[EKKi]

Mahlzeit Nik,

Ups, gibt's sowas wirklich?!

Ja.

Deine Lösung bietet keine text-decoration bei visited und hover!!

Na, dann bau Dir etwas entsprechendes ... das hier ist "SELF"HTML, nicht "Gib-ma-Komplettlösung-aber-dalli-dalli"HTML. :-)

Meine Postings - insbesondere die mit enthaltenem Quellcode - erheben *NIEMALS* den Anspruch, eine "Lösung" zu sein ... sie verstehen sich lediglich als Anregung, Idee oder Denkanstoß.

(Und ich denke, das ist bei einigen anderen Teilnehmern hier ähnlich ...)

MfG,
EKKi

[Nik]

Na, dann bau Dir etwas entsprechendes ... das hier ist "SELF"HTML, nicht "Gib-ma-Komplettlösung-aber-dalli-dalli"HTML. :-)

Meine Postings - insbesondere die mit enthaltenem Quellcode - erheben *NIEMALS* den Anspruch, eine "Lösung" zu sein ... sie verstehen sich lediglich als Anregung, Idee oder Denkanstoß.

Stimmt, bin html/css am lernen und bevor ich mich an dieses Forum gewand habe, habe ich bereits 3 Tage alleine probiert. Aus vorgegenbene Lösungen kann man auch lernen!

[Herbert]

Hier mein Lösungsvorschlag:

.1 a:link {
  color: #FF0000;
  text-decoration: none
 }

.1 a:visited {
  color: #00FF00;
  text-decoration: none
 }

.1 a:hover {
  color: #CCCCCC;
  text-decoration: none
 }

.1 {
  font-family:Arial, Verdana;
  font-weight:bold;
  font-size:20pt;
 }

.2 a:link {
  color: #00FF00;
  text-decoration: underline
 }

.2 a:visited {
  color: #00FF00;
  text-decoration: underline
 }

.2 a:hover {
  color: #0000FF;
  text-decoration: underline
 }

.2 {
  font-family:Arial, Verdana;
  font-weight:bold;
  font-size:20pt;
 }

.........und so weiter!

[Gunnar Bittersmann]

@@Herbert:

nuqneH

Hier mein Lösungsvorschlag:

Den du vergessen hast zu testen.

.1 a:link

Funzt nicht![tm] Siehe [Woodfighter] und [EKKi]

Qapla'

[Herbert]

@@Herbert:

nuqneH

Hier mein Lösungsvorschlag:

Den du vergessen hast zu testen.

.1 a:link

Funzt nicht![tm] Siehe

Bei mir schon! hast du was besseres?

[Gunnar Bittersmann]

@@Herbert:

nuqneH

.1 a:link
Funzt nicht![tm]
Bei mir schon!

„Bei mir“ heißt im IE im Quirksmodus?

hast du was besseres?

Ja: Firefox.

Qapla'