Autor Zpráva
Raslik
Profil *
Dobrý den,
jsem teprve začátečník, takže se možná ptám na banální věc, jsou to moje první stránky, které takto tvořím.
Na internetu jsem si našel tento příkaz:
<style type="text/css">
/* <![CDATA[ */
a {display: block; width: 500px; height: 500px; overflow: hidden;}
a:hover {text-indent: -500px;}
a img {border: none;}
/* ]]> */
</style>
Pomocí kterého se mění obrázky, když na ně najedu. Potřeboval bych tento příkaz ukončit, aby obrázky pod ním už tím nebyly ovlivněny.
děkuji
Taps
Profil
Raslik:
Potřeboval bych tento příkaz ukončit, aby obrázky pod ním už tím nebyly ovlivněny.
Lepší je pracovat s class a id
Tomáš123
Profil
Raslik:
Potřeboval bych tento příkaz ukončit, aby obrázky pod ním už tím nebyly ovlivněny.
Táto deklarácia sa vzťahuje na všetky obrázky v danom HTML súbore, takže to pochopiteľne postihne aj všetky obrázky.

Ak chceš takémuto správaniu predísť používaj pri vybraných obrázkoch triedy alebo idéčka a CSS zapisuj asi takto:
HTML:
<a><img class="obrazok_ktory_chcem_menit" src="obrazok.jpg"></a>
CSS:
a {display: block; width: 500px; height: 500px; overflow: hidden;}
a:hover {text-indent: -500px;}
a img.obrazok_ktory_chcem_menit {border: none;} /*"." symbolizuje triedu a to za ňou je názov danej triedy*/

Keď sťahuješ kódy z internetu musíš ich brať s rezervou...Napríklad ten hore spôsobí, že každý element <a> bude široký a vysoký 500px a v prípade, že obsah v ňom bude väčší vlastnosť overflow: hidden spôsobí, že ho nebude vidno.

Taps:
Keď je začiatočník, tvoja rada mu asi nebude veľmi prospešná... :-)
Bubák
Profil
Tomáš123:
Keď sťahuješ kódy z internetu musíš ich brať s rezervou...Napríklad ten hore spôsobí, že každý element <a> bude široký a vysoký 500px a v prípade, že obsah v ňom bude väčší vlastnosť overflow: hidden spôsobí, že ho nebude vidno.
Tvůj kód touto vlastností chybou trpí také, vhodnější je to třebas takto:
<a href="#" class="obrazok_ktory_chcem_menit"><img src="obrazok.jpg"></a>
CSS:
a.obrazok_ktory_chcem_menit {display: block; width: 500px; height: 500px; overflow: hidden;}
a.obrazok_ktory_chcem_menit:hover {text-indent: -500px;}
a img {border: none;} /* reset orámování, odůvodnění, proč právě takto, by dalo na samostatnou odpověď */

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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