Rajzok tiszta css (egyszeri div)

Biztos benne, hogy mindent tudni ilyen egyszerű CSS-tulajdonságokat «box-árnyék» és a «háttér»? Vagy talán az ő segítségükkel, akkor festeni a teljes képet? Mi is kapott 4 fun képek tisztán CSS.







Nemrég jöttünk át képeket, amelyek állítólag készült tiszta CSS csak egy egységet alkot. Eleinte nem hiszem, hogy ez lehetséges, hogy egy ilyen szép képek csak néhány stílus. Nagyon érdekel ez a téma, ezért úgy döntöttünk, hogy elmélyítsék tudásukat a háttér-ah és box-shadow-ah.

* A cikkben szereplő példák nem megfelelően jelennek meg a régebbi böngészők.

Az első teszt a következő:

Az ötlet az, hogy stilizálhatja egy div úgy, hogy a teljes képet. Ez kényelmes a használata CSS funkciók, mint a több háttérrel és box-árnyék. És nem elveszni a stílusok használjuk előfeldolgozó Kevesebb és Te „merge”.







Egyesülés vagy összeolvad tulajdonságai lehetővé teszik mellékel vesszővel vagy szóközzel konnotációja. A mi esetünkben, volt értelme. Lásd egy példa:

Összeállításakor megkapta a következő sort a CSS:

Egyetértek azzal, hogy ez a vonal nem nagyon könnyű megérteni, és csak 2 háttérben.

Egy egyszerű ikon nem kritikus, de a teljes kép még. Például, hogy felhívja a szem (például az alábbiakban), akkor alkalmazhatjuk egyidejűleg 20 háttérrel.

Ha az összes megadott méretek százalékában, akkor kap egy skálázható ikonra. És itt van az eredmény (a csúszka mozgatásával nagyíthat):

rajz perspektívák tiszta CSS nem az, hogy végtelen, de nagyon széles. Annak igazolására, ezeket a szavakat, már festett szemek és pizza, amelyek mindegyike csak egy blokk.




Kapcsolódó cikkek