Autor Zpráva
Lukáš123
Profil *
Dobrý den, poradíte mi prosím, jak nastavit, aby každý odkaz v menu měl jiný a:hover? Chci aby po najet´í myši byl odkaz č.1 červený, odkaz č.2 žlutý, odkaz č.3 modrý. Přes co nebo jak bych to měl řešit?

Děkuji



S pozdravem
Lukáš
panther
Profil
Lukáš123:
Přes co nebo jak bych to měl řešit?
třídy/identifikátory

Případně by to teoreticky šlo přes + selektor, kdyby byl míval dostatečnou podporu napříč prohlížeči.
Lukáš123
Profil *
Jak mám do stylopisu třídy nastavit a:hover?
panther
Profil
Lukáš123:
a.trida:hover {}
a#id:hover {}
Petr ZZZ
Profil
Lukáš123:


CSS:
.aaa a:hover   { color:#ff0000; }
.bbb a:hover   { color:#ffff00; }
.ccc a:hover   { color:#0000ff; }

HTML:
<ul>
  <li class="aaa"><a href="stranka-1.html">odkaz 1</a></li>
  <li class="bbb"><a href="stranka-2.html">odkaz 2</a></li>
  <li class="ccc"><a href="stranka-3.html">odkaz 3</a></li>
</ul>
Lukáš123
Profil *
No mám to přesně tak jak mi tady radíte a nefunguje to, http://www.headwear.ic.cz :(
joe
Profil
Musíš psát
#header a.zelena:hover
pak by to mohlo jít.
panther
Profil
Lukáš123:
zapsané je to správně. Odkazy zůstávají fialové, protože deklarace #header a {} přebije a.zelena:hover {}

Pomohlo by např. #header a.zelena:hover {}, pro ostatní barvy podobně.

joe:
musíš není to správné slovo. Nemusí, alespoň ne obecně. A pro začátečníka je lépe trochu rozvést, proč v tomto případě musí… nebo spíše, proč je to nejjednodušší úprava, která lze s tímto stylopisem udělat.
Petr ZZZ
Profil
Lukáš123:
Zkus to takhle (ty máš třídu v <a>, zkus ji dát do <li>):
<ul>
  <li class="zelena"><a href="http://headwear.ic.cz">ÚVOD</a></li>
  <li class="zluta"><a href="http://headwear.cz/zbozi.php">ZBOŽÍ</a></li>
  <li class="modra"><a href="http://headwear.cz/kontakt.php">KONTAKT</a></li>
</ul>
panther
Profil
Petr ZZZ:
ani to nepomůže, pořád bude deklarace s identifikátorem přebíjet tu s třídou. Nehledě na to, zda je třída u odkazu nebo položky.
Lukáš123
Profil *
OK. Funguje to. Děkuji za rychlé odpovědi.
Petr ZZZ
Profil
Lukáš123: „Funguje to.
Doplním, že funguje pantherovo řešení.

panther:
Díky, to přebíjení mi uniklo.

Nehledě na to, zda je třída u odkazu nebo položky.

Str4wberry mi napsal při jiné příležitosti, že .xxx a chytne všechna <a> v něčem s class=xxx, ale nechytne <a class=xxx>. – Odhlédneme-li tedy od toho přebíjení, platí i v našem případě, že přímo v <a> pseudotřída nefunguje:

.zelena a:hover   { color:#00ff00; }

<li class="zelena"><a href="#">ÚVOD</a></li> (funguje)
<li><a href="#" class="zelena">ÚVOD</a></li> (nefunguje)

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: