it-swarm-eu.dev

Jaké jsou nejlepší způsoby implementace crossového prohlížeče css?

Jaké jsou nejlepší způsoby implementace crossového prohlížeče css?

Pravidlo: jeden přístup k odpovědi.

4
stacker

K opravě problémů s aplikací Internet Explorer můžete použít podmíněné komentáře . Kromě toho byste nikdy neměli být zacíleni na Firefox/Chrome/Opera odděleně od sebe, všichni podporují standardy.

Caching by do toho neměl vstoupit; měli byste obsluhovat stejný kód pro všechny prohlížeče.

4
DisgruntledGoat

Nejlepší a nejjednodušší způsob je použití knihovny. Knihovny jako OOCSS, Blueprint nebo 960g jsou již zkonstruovány tak, aby replikovaly své zobrazení napříč hlavními prohlížeči. Po většinu času vám zbývá jen zajistit, aby vaše vlastní styly byly kompatibilní s různými prohlížeči a aby vaše značkování nezpůsobilo žádné problémy.

Vyhněte se hackům jako mor, pokud je to možné (ano, použijte podmíněné).

2
Kenneth Love

Když jsem si přečetl podobné otázky a odpovědi, začal jsem si myslet, že bych mohl být blázen, ale napsal jsem poměrně složité webové stránky používající docela trochu css, včetně css3 a dalších triků, a nikdy jsem se nemusel uchýlit k podmíněným komentářům.

Během kódování však svou práci neustále kontroluji ve více prohlížečích (kóduji převážně v Chromu a testuji v firefoxu a ie7). Když vidím, že se problémy objevují, jen udělám krok zpět, přijdu na to, proč se věci vykreslují odlišně, a často volím trochu odlišný přístup.

Jak již bylo řečeno, mám o to intelektuální zájem o tyto různé hacky a metody. Obzvláště se mi líbí čtení o technikách používaných CSS3 PIE a modernizr.

Nejlepší způsob, jak přistupovat k kódování napříč prohlížeči, je znát různé způsoby, jak různé prohlížeče interpretují váš kód, a psát jej způsobem, který jim nemůže pomoci, ale napraví ho.

1
Zach Lysobey

navrhovat a rozvíjet s webovými standardy
Neustále ověřujte své dokumenty a styly!
cross-browser/cross-platform test denně!
přinejmenším předtím, než odešlete žádost o vyžádání nebo se zaváží do úložiště.

měli byste přesto psát shodné dokumenty, ale to je zásadní pro psaní mezi prohlížeči a platformami css.

poznámka: skutečná síla validace neodpovídá 100% času; jakmile pochopíte, co nemusí být ověřeno, může být odloženo, a měli byste být okamžitě opraveni.
a to je moc: konstantní validace posiluje pravidla specifikací a budete dobře obeznámeni. neustálé testování napříč prohlížeči a platformami vás neustále zajímá, na kterých listech stylů uživatelských agentů prohlížeče bojujete nejvíce. přizpůsobit své styly jako takové, máte ještě méně problémů.

můžete použít knihovny a rámce, pokud se vám líbí, ale vytrháváte veškerá zranění a bolesti ze svých pracovních postupů a nikdy nedostanete do detailu detailní styly, které zde požadujete. libs/frameworks však udělají dobrou práci a udělují vám tuto moc, i když to obvykle přichází s nadýmáním stránek.

reset.css, normalizr.css, a dokonce i _*{border:none; margin:0; padding:0)_ reset jsou zbraně ve vašem arzenálu, které vyrovnávají hrací pole mezi prohlížečem, který vypíná vaše styly nebo jeho vlastní.

ano, doporučil jsem _*_ "hack", se dvěma dalšími možnostmi. každý má své vlastní místo, když bojuje s uživatelskými agenty.

kromě toho je absurdní nevyužívat nedostatky, které mají určité uživatelské agenty, protože uvedené nedostatky se nebudou vykreslovat se 100% kontinuitou a je třeba je řešit. přitom vám samotné vady poskytují perfektní háček, který je detekuje, nebo je dokonce čichá, takže je lze podle toho zacházet!

používat každý hack, chyba, funkce, non-funkce, které můžete dostat své ruce na ohýbat dom a vynutit prohlížeče inline.

...... pokud musíte. ale pokud se vyvíjíte s webovými standardy, zjistíte, že je nebudete potřebovat tolik jako v minulosti.

a protože se na ně spoléháte méně, když máte příležitost použít problém k řešení problému, použijte jej s rychlostí! už víte, co je problém, a také máte řešení zaměřené na problém a nic jiného.

každý prohlížeč má své vlastní způsoby cílení pouze, z nichž nejzjevnější jsou podmíněné komentáře.
použít podmíněné komentáře pro ie6-9 a použít podmíněné kompilace k vykreslení stylů pro ie10 a ie11.
ale znovu, pokud jste dwws a dvwws, můžete je zahrnout do každého dokumentu, který vytvoříte, ale najít šablony stylů jsou neplodné, hostit hrst stylů zaměřujících se pouze na 1-3 pixelové rozdíly nebo získat pozadí - barvy pro natažení (nebo ne) 100% atd.

1
albert

Co dělám, je použít reset CSS a poté podmíněné příkazy. Reset CSS opravuje téměř všechny problémy a podmíněné opravy všech problémů v IE. Pokud existují rozdíly mezi ostatními prohlížeči, obvykle se snažím je obejít, jako je zvětšení šířky všech prohlížečů nebo velikost písma.

Já osobně používám YUI reset CSS.

0
Darryl Hein

CSS3 PIE vypadá docela slibně jako vrstva kompatibility CSS3. U předchozích verzí CSS jsou samozřejmě i další obavy z různých prohlížečů.

Související otázka týkající se IE6, spousta užitečných informací: Mám se obtěžovat s podporou IE6?

0
JasonBirch

Přednastaveno varování varováním před použitím hackerů CSS.

Z čistě výkonného hlediska bude ukládání do mezipaměti efektivnější u jediného souboru, pokud z jiného důvodu než jednou odpoví na jeden požadavek HTTP od klienta. Kromě poskytování stejného souboru každému uživateli bez ohledu na prohlížeč, Podmíněné komentáře blokují stahování v některých situacích.

K cílení všech různých verzí aplikace Internet Explorer v jednom souboru existují různé hacky CSS. Nezapomeňte, že tím dojde ke zneplatnění vašeho CSS (pokud se vás týká ověření).

tělo {
 barva: červená;/* všechny prohlížeče */
 barva: zelená\9;/* IE8 a nižší */
 * Barva: žlutá;/* IE7 a nižší */
 _Color: orange;/* IE6 */
}

Blokování podmíněných komentářů je opravdu problém pouze v některých případech v IE8, když existuje podmíněný komentář. V závislosti na tom, co si myslíte o podpoře aplikace Internet Explorer, to může nebo nemusí být problém.

Osobně používám podmíněné komentáře. Osobně se domnívám, že hacky CSS jsou hrozné, a že jakýkoli zásah do výkonu, který pochází z podmíněných komentářů, ať už je to skutečné nebo imaginární, nestojí za problém , který hackuje CSS často způsobují.

Implementace podmíněných komentářů je relativně snadná a je zde skvělý článek o jejich použití v Quirksmode. Následující text bude řešit pouze IE6:

<! - [if IE 6]> 
 <link rel = "stylesheet" type = "text/css" href = "/ media/css/ie6.css" /> 
 <! [Endif] ->

Existuje syntaxe, která vám umožní zacílit na Internet Explorer verze, která se rovná, menší než, větší než, menší než nebo rovná, větší než nebo rovno danému číslu verze. Výše uvedený příklad je stejný jako.

0
Bryson