Tanulási gyors- css

Bemutatjuk specifikus CSS paraméter, akkor a választás - aláírja paraméterek teljesen vagy lerövidítik a beállítást, és foglaljon bele sokan mások.

Nézzük meg, hogyan kell használni a rövidített jelölés, és nézd meg néhány példát. Igyekszünk maximalizált magyarázni, hogy ez.

Tanulási gyors- css


Példa rövidített jelölése


Annak érdekében, hogy jobban megértse a jelentését ennek rövidített jelölése, nézzük meg ugyanazt a megadott paraméter teljes formátum:


Akkor már értem, miért a legtöbb CSS-fejlesztő szívesebben használják a rövidített jelölés - az első példa megmutatja nekünk, hogyan 5 sor fér egy.

Egy egyszerű példa gyorsírásos

Néhány rövidítés munka rendkívül egyszerű módon. Példa a lehetőséget háttér, hogy mi adta meg a fent, az egyik legösszetettebb típusok (nehezebb, mint az alábbi példákban a cikk későbbi részében). Ott is nagyon egyszerű megérteni a rövidített jelölés.

Margin és padding - kiváló példák használt paramétereket a fejlődési folyamat nagyon gyakori. És nagyon gyakran használják őket szó szerint oboznacheniyax. Ezen felül, ezek nem olyan nehéz megérteni:


Ebben a példában, bár csökkent a három más értékek, ezeket az értékeket meg kell egyeznie a egyetlen kijelzőn. Így, a kódot, mind a 4 oldalán az elem lesz az értéke egyenlő a behúzás 20 pixel.

Azt is tegyük a következőket:


Ebben a példában kijelentjük egy részlete felső és jobb margó. Az alsó és bal margó, bár nem jelentette be pontosan, akkor ugyanazokat az értékeket, mint a felső és a jobb (ebben a sorrendben). Ily módon a blokk lesz egy felső és egy alsó bemélyedés egyenlő 20 pixel, és a bal és jobb oldalán lesz egyenlő behúzás 10 pixel.


Az határait paraméter CSS3 border-radius fog működni, nagyon hasonló módon, azzal az eltéréssel, hogy a paraméter társított sarkok lekerekített sarkokkal helyett az oldalán.

Bonyolultabb gyors-

Vannak még bonyolultabb változatok gyorsírásos, de (néhány kivételtől eltekintve) nem valószínű, hogy problémát okozhat, ha ez jó, hogy megtanulják, hogyan kell használni őket. Példa háttér, amelyhez korábban idézett, csak egy ilyen jelölést.

Nézzük csak válassza ki az értékeket, amelyekkel esetleg félreértések:

* List-style
* font
* határon
* vázlat

CSS3-funkciókat használó rövidített jelölés felvenni egy kicsit bonyolultabb a stílus, a következők:

Tehát mit tesz ezek az értékek sokkal bonyolultabb? Mivel ezek a paraméterek figyelembe a különböző típusú értékek (néha kulcsszavak olykor néhány elemet, és így tovább), a bevezetése bizonyos értékeket a rövidített jelölés gyakran nem várt eredményekhez vezethet.

Íme egy példa a használatára háttér opciók közül:


A fenti kódot, akkor valószínűleg arra számítanak, hogy a cél elemet fog kiadni nem ismétlődő háttérképet, meg a tetején egy kék háttér. De ez nem fog megtörténni, amíg nem adja át sorozata értékeket. Mivel használt rövidített háttérben, ez vezet az a tény, hogy az értékek társított paraméter háttér visszaáll a kiinduló helyzetbe. Ebben az esetben a háttér színe válik „átlátható” újraírás érték „kék”.

Ne essen abba a csapdába

Fontos megérteni, hogy minden alkalommal, amikor használja az egyik ilyen bonyolult jelöléssel kimaradt a kapcsolódó értékeket ez a szimbólum alapértelmezettre.

Elvileg ez nem jelent problémát, mert a társított paramétereket háttérrel, listák, francia, stb értékek nem öröklődnek a szülő elem. Az egyetlen pillanat, amikor szembesülnek a probléma a kommunikáció gyorsírással font.

Ez az, ami arra késztetett bennünket, hogy egy ilyen kis kézikönyv, amely részletesen ismerteti, problémák merülhetnek fel, míg a munka egy rövidített írásmódot betűtípusokat. Arra számítunk, hogy az adott tipográfia beállítások öröklik az értékeket elemmel. De amikor a betűtípust szimbólum, mind a társított paraméterek kijelölése visszaáll az eredeti értékre, amely megszakítja a természetes szukcesszió folyamata.

Munka közben a betűtípus rövidített szimbólumok és más szimbólumokat, akkor is befut a probléma, ami az, hogy ha elhagyjuk kívánt értéket, az egész sort figyelmen kívül fogja hagyni a böngésző. Ez az, amit meg kell figyelni, különben nem lesz sokáig vakarja a fejét, és nem értik, hogy miért nem működik.

Természetesen, ha egy kezdő, akkor jobb, ha használja a teljes érték először megérteni hol illik. De a legtöbb esetben sokkal könnyebb és hatékonyabb használata rövidített jelölése.

Kapcsolódó cikkek