Css visszaállítása vagy normalizálja
RESET eredeti beállítások CSS
Ahhoz, hogy egy kis stabil, néhány fejlesztők visszaállítja az összes területen és francia az univerzális szelektor:
Meghatározásával padding a listán, és kezdjen, hogy a stíluslapot, azt kapja, amit elvár. Ugyanakkor a használata * azt jelenti, hogy a területen, és az alapértelmezett behúzás „összeomlott” minden elemét, és amint van hozzá egy elemet a forma, akkor lett nagyon nehéz.
Ő nem vissza egyes tulajdonságait a sok (de nem az összes) az elemeket a sima szöveges megfelelője. Mivel csak a megfelelő visszaállítási elemek tehát kerülni bizonyos problémák *. Akkor tudjuk meg egy stílust az ilyen figyelmen kívül „obesstilennyh” tulajdonságok, ügyelve arra, hogy építünk egy stabil cross-browser alapon. Ilyen kinevezés stílusok, emellett működik, mint egy kapcsoló kell szándékos telepítés alkalmas stílusok ezeket az elemeket.
PROBLÉMÁK gyári visszaállítás CSS
CSS kisülések voltak a kegyet, de most, különösen, ha a magassági tetemek keretek, gyakran használják „ahogy van”. Például Eric feltételezhető, hogy más fejlesztők épít oldalak a stílusok általa kínált átállítást megfelelően azok visszavonásáról, és Meyer visszaállítása első változata ideiglenesen aktiválja ezt a szabályt:
Sajnos, a valóságban nem minden stílusban definiált fókusz, és a második változat Eric törölte azt.
Alkalmazása bevezetések, úgy érzi, egy kicsit perverz. Alapértelmezett visszaállítása böngésző stílusok teszi gondolni, hogy az egyes elemeket meg kell jeleníteni, segít abban, hogy a használt elemek szemantikai helyett az alapértelmezett stílusok. De elemeket, mint az i és em szinte mindig a stílus az alapértelmezett böngésző. Egyéb alapértelmezett böngésző stílusok, mint a korábbi egyszer nevetségesen nagy mennyiségű fejléc, a változás és lesz elég elviselhető alapértelmezés szerint. A problémák merülnek fel, ha valaki meg akarja alkalmazni továbbítása után a dömpingelt HTML elem csak kijelölt „obesstilennymi” reset stílusokat.
Számomra a legfontosabb probléma az örökség a kibocsátások, ami spam a böngésző-alapú eszközök. Amikor megpróbálja követni a CSS probléma valaki másnak a kódját mélyen beágyazott elem, amely nem segít:
CSS Reset hajlamos megismétlődik miatt öröklési
NORMALIZE.CSS
Nikolas Gallaher (Nicolas Gallagher) és Dzhonatan Nil (Jonathan Neal) volna más megközelítést Normalize.css. „Egy kis CSS-fájl, a legjobb cross-browser összhang az alapértelmezett stílus elemeit HTML». Mint ahogy az a CSS reset ez ad nekünk egy szilárd kiindulási pont a határon böngésző kompatibilitás - elsősorban a kiváltó oka a kérelem megkönnyebbülés -, de a két megközelítés különböző filozófiai szempontból.
„Obesstilenny” eleme rendezetlen listát
Alkalmazza Meyer visszaállítása
Alkalmazza Normalize.css v1
Alkalmazása Normalize.css v2
Világosan mutatja a különbséget a filozófia, példaként Meyer reset jelenik meg egy pár sornyi egyszerű szöveget margó nélkül, a kitöltés, vagy markerek, míg példák Normalize.css mint az alapértelmezett stílusok. A különbség a stílusokat használ a ul, túl könnyen észrevehető.
Ez azonban nem minden alkalmazott stílusok a ul. Összehasonlításképpen, itt ugyanaz a „obesstilenny” screenshot, de látható stílusok ágens a Firefox és az Opera 21 Következő 15:
Stílusok Mozilla felhasználói ügynök
Stílusok Opera User Agent
Ez az a CSS, amit vissza, vagy normalizálni.
Normalize.css 2-es verziója támogatja a modern böngészők plusz IE 8, míg az 1-es verzió, ráadásul további támogatást nyújt a régebbi böngészők, mint az IE 6 és 7 Ezek a régebbi böngészők több kell normalizáció, és itt vannak hatással kisebb hiányosságok - például úgy, hogy a függőleges mező egy beágyazott listát a fenti példában a screenshot Normalize.css v1. A szétválasztás két változat akkor hasznos, ha már nincs szükség arra, hogy olyan magasabb szintű támogatása régebbi böngészők, és ha azt akarjuk, hogy mindent tudni hangulati.
Normalize.css is segít kijavítani néhány hibát böngésző, beleértve a „megjelenítési beállítások HTML5 elemek, szerkesztés font-size előformázott szöveg, SVG túlfolyó IE9 és sok hibák formák böngészők és operációs rendszerek.” Például az alábbi CSS WebKit javít a probléma az új elem HTML5 input type = »keresés»:
Enélkül a használata az alapértelmezett WebKit'om -webkit-megjelenés: searchfield; fortype = »keresés» akadályozza kijelölése betűtípus, behúzás, határok, és a háttér tulajdonságok OS X és iOS okoz hibás viselkedés border tulajdonság a Windows.
KÖVETKEZTETÉS
Nagyon különbözik a szempontból a filozófia a CSS ilyen bevezetések Meyer Reset Normalize.css nagymértékben követi az azonos hagyomány nyomdokain Tanteka és Eric. Lehet, hogy már használja azt - ez része a HTML5 Boilerplate mag. Kódnak és az új Pure YUI.
Minden asztal a böngésző stílusok általában egy és remélhetőleg egy nap nem lesz több köze visszaállítása vagy normalizálás. Van még egy ésszerű érv, hogy ne aggódjunk a kis különbségek böngészők. Addig is, ha használ CSS reset, vagy nem használ semmit a következő projekt, egy esélyt, hogy hagyja Normalize.css.
ALKALMAZÁSOK
1. Jól látható, hogy a felhasználói ügynök táblázatstílusokat Mozilla. WebKit és az IE. CSS2.1 stylesheet alapértelmezett felhasználói ügynök hozza az első a különbség a terv (régi) böngészők. Ezek a stílusok is olyan dolgok, mint a stílus - próbálja felvenni a CSS stílus és meglátjuk, mi történik.
2. Azóta minden böngésző elérte a telepítést francia a listában padding-left és padding-start, míg IE7 - legújabb böngésző IE, alkalmazása erre margin-left.
Utóirat. Mivel a „bang” a területen, és padding az összes elem egy * nagyon nehéz, van egy univerzális választó visszaállítást, amelyek alapján meg kell jegyezni, *. Ez megváltoztatja a keret és kitöltés, amely része lesz a szélessége egy elem, és nem túl azt. Ha szeretne többet megtudni ezt, nézd meg a cikket Paul Irish (Paul Irish) box-méretezés: border-box - minden könnyet! .
Felülvizsgálat: Team webformyself.
A legtöbb IT hírek és webfejlesztés A csatorna-távirat