| Autor | Zpráva | ||
|---|---|---|---|
| Patrik16 Profil |
#1 · Zasláno: 22. 11. 2016, 21:17:02
Čaute potrebujem poradiť mám odkazy a všetky sa my po prejdení myšou podčiarknu teda každý zvlášť ale chcem aby pri každom jednom podčiarknuti bola iná farba toho podčiarknutia ako na to?prosím poraďte.
|
||
| jakre Profil |
Je to jednoduché, použij kaskádové styly. Nejprve zrušíš výchozí podtržení po najetí myší na odkaz, poté přidáš dolní rámeček, pro který si zvolíš požadovanou barvu.
V této ukázce se můžeš podívat, jak toho docílíš. |
||
| Tomášeek Profil |
jakre:
Ne. Border se vykresluje jinde a jinak než text-decoration. Všude bude níž, minimálně v některých prohlížečích bude mít jinou délku, např. v Safari (na Macu určitě, na Windows nevím, v jiných kombinacích prohlížeč/OS také nevím) bude ignorovat znaky pod linkou - text decoration se při znacích pod linku přeruší, aby tyto znaky nepeškrtl, zatímco border nikoliv. Rozdíl, zejména v pozici, můžeš vidět, pokud původní podtržení ponecháš - jsfiddle.net/pbodcqcL/2. Patrik16: Musíš použít vnořený element, konstrukce pro černý text s červeným podtržením by mohla vypadat třeba takto: <style>
a {text-decoration: none; color: red;}
span {color: black;}
a:hover {text-decoration: underline}
</style>
<a href=""><span>text</span></a> |
||
| Patrik16 Profil |
Keď dám ďalší span napríklad span{color:orange;};span{color:green}
<a href=" "><span>text</span> < a href=" "><span >text</span> Zmení my to podčiarknutie na oranžové tam kde chcem a na zelené tam kde chcem alebo my to zadefinume len 1 farbu? Nemôžem to teraz vyskúšať lebo som odcestovaný... ok vyskusam uvidim zatial dakujem. jakre: Ešte otázočka prečo musí byť span{color:black}? Nespraví my to podčiarknurie na čierne u všetkých odkazov? |
||
| jakre Profil |
Tomášeek:
Nabídl jsem takové řešení, jelikož nabízí mnohem více možností a přišlo mi vhodnější, než vnoření spanu do odkazu. Patrik16: V řešení, které poslal Tomášeek určuje vlastnost spanu (tedy černá barva) vlastnost odkazu. Pokud měníš jeho vlastnosti, dochází pouze ke změně barvy odkazu. Pokud chceš docílit toho, aby mělo podtržení odlišné barvy, může kód vypadat takto: <style>
a{text-decoration: none}
a.cervena{color: red}
a.oranzova{color: orange}
a.zelena{color: green}
span {color: black}
a:hover {text-decoration: underline}
</style>
<a href="" class="cervena"><span>text</span></a>
<a href="" class="oranzova"><span>text</span></a>
<a href="" class="zelena"><span>text</span></a> |
||
| Tomášeek Profil |
#6 · Zasláno: 23. 11. 2016, 09:42:29
jakre:
„jelikož nabízí mnohem více možností“ Možnosti nabízí stejné, jen v horší formě. „a přišlo mi vhodnější, než vnoření spanu do odkazu.“ Ano, není to ideální, nicméně, vizuálně asi jediné správné (chci-li podtrhnout inline text uvnitř dalšího textu, nic jiného než text-decoration by nemělo přijít v úvahu, právě kvůli pozici a celkovému chování).
Krom té tvé borderové alternativy doplním ještě :after element na odkazu, se 100% šířkou a 1px výškou (či jinou, samozřejmě). Tam se bude dát lépe pracovat s pozicí blížící se klasickému podtržení (ono to mmch. jde i u toho borderu), nepřeškrtnutí dolních nožiček a smyček písmen v Safari to však nepředejde.
Patrik16: „Zmení my to podčiarknutie na oranžové tam kde chcem a na zelené tam kde chcem alebo my to zadefinume len 1 farbu?“ Základ CSS, doporučuji jej nastudovat. „Ešte otázočka prečo musí byť span{color:black}?“ Opět základ CSS. Zkus tu černou odsrtanit a uvidíš, co se stane a proč tam je. „Nespraví my to podčiarknurie na čierne u všetkých odkazov?“ Do třetice základ CSS. |
||
| Patrik16 Profil |
#7 · Zasláno: 23. 11. 2016, 14:03:15
Ja viem základy a aj komplikovanejšie css možno že som nejaké funkcie vynechal a nikdo nevie všetko preto sa to pýtam
|
||
| Keeehi Profil |
#8 · Zasláno: 23. 11. 2016, 15:47:22
Patrik16:
„Ja viem základy a aj komplikovanejšie css možno že som nejaké funkcie vynechal a nikdo nevie všetko preto sa to pýtam“ Opravdu? Tak to by jsi snad měl vědět, že: span{color:orange;}
span{color:green;}span{color:green;}Nebo tohle snad považuješ za něco jiného než základy? |
||
| Tomášeek Profil |
#9 · Zasláno: 23. 11. 2016, 15:48:41
Patrik16:
„a aj komplikovanejšie css možno že som nejaké funkcie vynechal“ Vynechal jsi naprostý základ. Promiň, ale: - neznalost tříd (5. odkaz Základního kurzu na CSS), v sekci "Pro pokročilé" je přímo odkaz, který vystihuje tvůj problém - Různé barvy odkazů pomocí CSS - „Keď dám ďalší span napríklad span{color:orange;};span{color:green} ... Zmení my to podčiarknutie na oranžové tam kde chcem a na zelené tam kde chcem alebo my to zadefinume len 1 farbu?“ - Pravidla kaskádování (8. odkaz téže stránky) neukazuje nejen na neznalost komplikovanějšího CSS, ale na absenci základů jazyka, nebo jeho totální nepochopení. |
||
| Patrik16 Profil |
....
|
||
|
Časová prodleva: 8 let
|
|||
0