Styl písma pro odrážky

28. 1. 2014 09:05:18

Dobrý den.

Neví zde náhodou někdo jaké fonty jsou použity pro tyto odrážky? Rád bych totiž tyto odrážky udělal pomoci css a ne pomoci obrázku.

28. 1. 2014 09:05:18

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990640

Michal Brůžek

(58 hodnocení)

28. 1. 2014 09:12:01

sipka je Open Sans, plus je Arial

28. 1. 2014 09:12:01

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990639

Miloslav Lešetický

(10 hodnocení)

28. 1. 2014 09:19:28

sweet

Takhle nějak? Odrážky

http://klient.plavacek.net/odrazky.html. Připomínám ale, že obrázek na pozadí elementu LI je vždy nejjednodušší řešení.

28. 1. 2014 09:19:28

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990638

František Křiklán

(17 hodnocení)

28. 1. 2014 09:44:33

Není jednodušší pro seznam využít css funkce content zkombinovat s before? Než to psát takhle.

28. 1. 2014 09:44:33

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990637

Miloslav Lešetický

(10 hodnocení)

28. 1. 2014 09:53:13

bebo

Možná ano, ale mé řešení je zpětně kompatibilní i s prohlížeči, které uvedené vlastnosti neznají. Navíc pomocí :before nevyrobíš imitaci obrázkového plus, protože do této pseudotřídy nejdou vkládat HTML tagy.

28. 1. 2014 09:53:13

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990636

Aleš Trunda

(16 hodnocení)

28. 1. 2014 12:17:39

Napsal Plaváček;1049865
bebo

Možná ano, ale mé řešení je zpětně kompatibilní i s prohlížeči, které uvedené vlastnosti neznají. Navíc pomocí :before nevyrobíš imitaci obrázkového plus, protože do této pseudotřídy nejdou vkládat HTML tagy.

before a after je od IE8 - kam až chceme mít kompatibilitu?

a proč bych jako nevyrobil imitaci obrázkového plus přes before - úplně v pohodě a žádné html tagy k tomu přece nepotřebuji

především obrovská výhoda before je, že pro zprovoznění jednoduše přidám pár řádků do css nehledě na to kolikrát to použiji, kdežto v tvém řešení, pokud bych měl těch odrážek 100, tak u každé budu jako opice psát + ! A co když to budu potřeboval potom změnit z '+' na '-', v css změna jednoho řádku, v tvém řešení u 100 odrážek budu dělat 100 změn!

Taky píšeš "obrázek na pozadí elementu LI je vždy nejjednodušší řešení" - v tomto případě, kdy je jako odrážka jednoduché plus, tak nejjednodušší to určitě není. Přes css to udělám ještě jednodušeji a rychleji, než v grafickém programu a stejně tak jakákoli změna se bude přes css taky dělat rychleji. Další nevýhoda - přibližování - obrázek se zdeformuje, řešení přes css ne. A další nevýhoda - obrázek zabere o dost víc místa = větší provoz na serveru, nehledě na to, že si musím někde uchovávat i vektorový obrázek pro případnou změnu, ať to nemusím celé dělat znovu.

Doufám, že jsem to osvětlil jasně a přispěl tak ke vzdělanosti zdejších kodérů.

Občas se tady člověk i nasměje, když čte, co kdo napíše za absolutní nesmysly.

28. 1. 2014 12:17:39

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990635

Miloslav Lešetický

(10 hodnocení)

28. 1. 2014 12:31:46

ivanbohatyr

a proč bych jako nevyrobil imitaci obrázkového plus přes before - úplně v pohodě a žádné html tagy k tomu přece nepotřebuji.

Udělej, prosím, živou ukázku pomocí pseudotřídy :before tak, aby plus mělo červené pozadí a bílý text. Rád se přiučím.

before a after je od IE8 - kam až chceme mít kompatibilitu?

IE 7 ještě zdaleka (bohužel) není mrtvý prohlížeč.

28. 1. 2014 12:31:46

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990634

Aleš Trunda

(16 hodnocení)

28. 1. 2014 12:56:40

No v diskuzích rád dám radu, ale naopak rady typu napiš kód dávám nerad, k tomuto slouží sekce poptávky.

Nicméně abych to tedy dotáhnul do konce, tak s touto malou dopomocí to určitě už zvládneš sám:

ul li:after {

content: '+';

background-color: #FF0000;

color: #FFF;

}

nastavení patřičných rozměrů a pozice už určitě nebude problém.

28. 1. 2014 12:56:40

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990633

Miloslav Lešetický

(10 hodnocení)

28. 1. 2014 13:09:03

Oukej, tak pro ty, kteří neřeší starší prohlížeče, aktualizovaná ukázka:

Odrážky

http://klient.plavacek.net/odrazky.html. Lepší je použít pseudotřídu :before.

28. 1. 2014 13:09:03

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990632

Aleš Trunda

(16 hodnocení)

28. 1. 2014 13:31:44

Napsal Plaváček;1049977
Oukej, tak pro ty, kteří neřeší starší prohlížeče...

V tomto případě já tohle vůbec neřeším. Pokud někdo opravdu má stále archivní IE7, tak by měl počítat s tím, že v dnešní době mu archivní prohlížeč může přivodit komplikace. Pokud by mělo přes before být na webu logo, tak potom ok, asi by se to umístění loga mělo vyřešit jinak, ale taková drobnost jako odrážka, ta i když nebude zobrazena, tak to neznamená prakticky nic.

28. 1. 2014 13:31:44

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990631

Miloslav Lešetický

(10 hodnocení)

28. 1. 2014 13:34:38

ivanbohatyr

Odrážky u seznamů, zvláště delších, se používají pro zpřehlednění textu. Nepovažuji to za drobnost a dovolím si tvrdit, že zdaleka nejbezpečnější je použití obrázku na pozadí. Nicméně jde o volbu každého kodéra a jsme tak trošku mimo téma.

28. 1. 2014 13:34:38

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/styl-pisma-pro-odrazky/#reply990630

Pro odpověď se přihlašte.

Přihlásit