A Cascade css

Ez a fejezet részletesen, hogy miért Cascading Style Sheets (Cascading Style Sheets, CSS) nevű lépcsőzetes. Kezdeni, emlékezzünk, hogyan tudjuk stílusossá weblapon:







  • csatlakoztassa a külső stíluslap;
  • add belső stíluslapot HTML dokumentum;
  • határozza meg a stílust taget, a címke style attribútum a kívánt értékeket (inline-style).

Ezek hozzáadásának módszerei stílusok is használható egyszerre. Például tag

Azt be lehet állítani ugyanabban az időben, mint a stílus a külső stíluslap és a hazai. Ezen túlmenően több kiviteli formázást felírható egy stíluslap

. Például:

Ebben a példában a címke

három formázási lehetőségek megadva. De hogyan működik a böngésző sorrendbe között stílusok? Milyen stílus a fenti kerül kiválasztásra, és milyen alapon? Ez nekünk, és látható.

prioritások stílusok

A Cascade CSS - ez a mechanizmus, amellyel az elem HTML dokumentumot lehet használni több szabály CSS. A szabályok különböző forrásokból származhat: .. A külső és belső stíluslapok öröklési szülő elemekből, osztályok és azonosítót Címkeválasztó a style attribútum, stb ezekben az esetekben gyakran konfliktus stílusok, hozták létre prioritásrendszerét: a végén alkalmazza a stílust forrásból származik a magasabb prioritású.

Milyen források jelentősebb, és amely - legalább? Értsd ez segít ebben a táblázatban, ahol a súly (fontossága) minden egyes választó. Minél nagyobb a tömeg, annál magasabb a prioritás:

Ha úgy történt, hogy a két szelektor azonos súlyú, a prioritás a stílus, ami alatt a kódot. Ha az egyik elem van megadva és a stílus a külső és a belső táblákat, az elsőbbségi, hogy a stílus az asztalra, ami alatt a kódot.

Példa: a belső stílus lap állítva piros címke

. és a külföldi - zöld ugyanazt a címkét. A HTML dokumentum, az első dolog, amit csatlakoztatott külső stíluslapot, majd hozzáadjuk egy belső táblázat egy tag . Ennek eredményeként, a színe a címke

Ez lesz piros.







Ez - az egyik módja, hogy ellenőrizzék a jelentősége a stílusok. Egy másik módja, hogy növelje a prioritás - kifejezetten növeli a súlyt választó, mint a hozzáadásával vagy osztály azonosítója.

Visszaállítása stílusok használatával reset.css

Az előző fejezetben már említettük, hogy minden böngésző saját beépített stílusok HTML-dokumentumok célja, hogy javítsa az olvashatóság. Ön valószínűleg már látott, úgy néz ki, mint a „csupasz” weboldal a böngészőben: kék, aláhúzott linkeket, fekete betűk, vastag fejezetek, és így tovább ..

Minden böngésző a különbségek beágyazott stílusok: például az IE nincs behúzva a felső szélét az ablak, és a Firefox. Sok ilyen különbségek. Így nem zavarja a cross-browser írásakor a saját CSS stílusokat, akkor a módszer visszaállítani a belső stílust.

Eszköz visszaállítása a stílus - valójában ugyanazt a táblázatot CSS, amely ismerteti a szabályokat, amelyek vissza az integrált böngésző stílusok létrehozása alapvető értékeit tulajdonságait. Ez az úgynevezett Asztal reset.css és arra szolgál, hogy meg lehet kezdeni, hogy hozzon létre egy stílust „a semmiből”. Itt egy példa a szabványos mentesítés táblázat:

Természetesen vannak más variációk visszaállítása CSS, például most népszerűbb Normalize.css. amely ellentétben a Reset CSS, megtartja sok hasznos alapértelmezett stíluslapot, és nem mossa tisztára. Ez kényelmes, mert így nem kell újra állapítsa meg a stílus többféle standard elemeket.
Ha azt szeretnénk, hozhat létre, és nyújtsa be a visszaállító stílusok alapján az Ön igényeinek.

És most néhány szó, ami a fenti táblázat nullázódik stílusok:

  • első választó tartalmazza a legnépszerűbb címkék, melyek eltávolítja a padding, mező és a keret, valamint rendelt a betűméretet 100%;
  • A második csoport választó helyes megjelenítés HTML5 címkék a régebbi böngészők;
  • segítségével az ingatlan line-height választó test egyenlőre van beállítva sortávolság (térköz) a szöveg;
  • ol listák. ul eltávolítjuk markerek;
  • felemelte idézetek és egyéb tartalmak előtt és után a tartalmát a blockquote tag. q;
  • hozzátéve egyszerűsített keret táblázatcellákba.

Reset stíluslap előtt csatlakoztatni kell a saját stílusukat. Ha figyelmesen elolvassa a bekezdés a prioritásokat, amelyek már érthető, hogy miért kellene reset.css előtt más stílusok: mivel a meghatározott szabályok az alábbi kódot, átírják a szabályokat korábban bejelentett.

Cascade CSS - stílusok az a képesség, hogy átfedik egymást, és a keverék. Az utolsó elem a stílus, ami látható a böngésző - ez a kombináció több stílus következetesen alkalmazzák.

Amikor a konfliktus szabály tehát több stílus prioritásokat. Előnyben részesülnek azok a stílust tartják, hogy érthetőbb legyen.

Meg kell tudni, hogy a prioritások kiosztási szabályok közötti stílusok létrehozásához írástudó stíluslapok.

Az első része a bemutató alatt. A második rész a könyv, kezdjük tanulmányozásával CSS betűtípusok Web betűtípusok és a csatlakozáskor.