Skip to the main content
Tag: 'css'
[] Petak, 5. X.

Feed the Frog

Nahrani žabu (Feed the Frog) je jedna jednostavna i brza web igra u kojoj je cilj uloviti što više muha prije nego istekne vrijeme. Ako vam je prelako probajte promijeniti dan u noć (u opcijama). Inače u igri nema sličica već je sva grafika napravljena pomoću CSS-a. Trebalo bi raditi i na mobitelu. Naš rekord je 22. Autor: Jason Stewart CodePen

Nastavak

[] Petak, 28. rujna

CSS Grid visual cheatsheet

Nakon CSS Flexa evo i šalabahtera za CSS Grid, iz istog izvora. Sva osnovna svojstva na okupu. Pregledno i vrlo korisno. Podrška u web preglednicima skoro idealna. Svejedno, novi CSS Bootsrap koristi flex, a ne grid. Koja je vama shema bolja?

Nastavak

[] Četvrtak, 27. rujna

Flex visual cheatsheet

Osnove Flex rasporeda (prijeloma) u CSS-u koji omogućava da se elementi u kontejneru automatski poredaju prema veličini ekrana. Lijepo, minimalistički složeno. Koristite li flex razmještaj u svojim radovima? Podrška u preglednicima je danas solidna.

Nastavak

[] Četvrtak, 20. rujna

Animated CSS bridge

Opet nešto što je zasigurno vrlo zahtjevno za izradu: animirani CSS most napravljen bez, pogađate, ijedne linije JavaScripta. Ujedno i interkativan: pomoću opcija na dnu ekrana možete zaustaviti/pokrenuti rotaciju, mijenjati između žičanog i popunjenog modela te povećati ili smanjiti udaljenost (zoom).

Nastavak

[] Utorak, 11. rujna

Color Leap

Color Leap je sat koji prikazuje palete boja, kroz povijest, od skulptura egipatske civilizacije oko 2,000 godina prije naše ere do reklamnih plakata šezdesetih godina prošlog stoljeća. Klik na boju u paleti za kopiranje koda u međumemoriju (clipboard).

Nastavak

[] Ponedjeljak, 16. srpnja

Quirk DIV

Jedan HTML DIV element koji u svakom web pregledniku izgleda drugačije, ali dobro, situacija i jest neobična, moramo priznati:

div {
outline: inset 100px green;
outline-offset: -125px;
}

Izvesti ovako nešto nije fora ako imate na raspolaganju JavaScript i/ili koji kilobajt CSS-a, ali u 4 linije je nešto vrijedno spomena.

Dodatni štos je da ga i email klijenti drugačije prikazuju. Dobrodošli u devedesete. :)

Nastavak

[] Petak, 13. srpnja

CSS radio buttons

Svakome tko je sam složio više od dvije - tri web stranice vjerojatno je jasno da su radio gumbi jedan od HTML elemenata koji nisu baš najbolje riješeni. Ne daju se fino stilski posložiti. Na ovoj stranici možete pogledati više od 30 različitih CSS rješenja za radio gumbe koja potpuno mijenjaju taj HTML element. Primjeri na CodePenu.

Nastavak

[] Petak, 6. srpnja

CSS Media Queries

U današnjem web dizajnu vrlo je potrebno prilagoditi stilove izlaznom uređaju, veličini zaslona, razlučivosti i orijentaciji prikaza. Zato je prilično dobro znati što sve mogu CSS Media Queries (tražim dobar prijevod). Ovaj brzi vodič uputit će vas u osnove stvari koje o toj temi svaki webaš mora znati. Nema puno, par minuta.

Nastavak

[] Četvrtak, 21. lipnja

Color Hex screenshot

Pregledan web alat za razne informacije o bojama, modelima boja (RGB, HSL, HSV, CYMK), različitim paletama boja, srodnim i komplementarnim bojama itd. Color Hex može generirati i CSS te HTML primjere, što je dobrodošlo za "počinjanje od nule". I ne zaboravite prolistati najpopularnije palete boja. Prvenstveno za webaše i one koji se tako osjećaju.

Nastavak

Pure CSS random rain

Osvježavajuća CSS kiša napravljena bez JavaScripta koristi SVG grafiku i CSS varijable, ali je svejedno fino napravljen demo uradak. Pogotovo tijekom ovih zaista vrućih sunčanih dana. A još nije ni ljeto... CodePen

Nastavak

1 2 3 ... 10 ››