Kako ustvarimo gumb, ki ima prekinjeno obrobo

Kako ustvarimo gumb, ki ima prekinjeno obrobo

Med pregledovanjem spleta sem naletel na zanimiv primer, gumb, ki je imel prekinjeno obrobo. Rezultat je bil enak gumbu na sliki, avtor pa je to rešil s pomočjo JavaScripta in CSSja. Izbrana rešitev mi ni bila najbolj všeč, zato sem se lotil rešitve, ki uporabi samo CSS.

Preberi
CSS: Dark mode, Light mode, …

CSS: Dark mode, Light mode, …

Funkcionalnost uporabe različnih tem na računalniku oz. programski opremi je dobrodošla. Namreč programiranje zvečer poteka veliko lažje v temnih temah (Dark mode) je primernejše za naše oči in posledično prepričuje glavobole naslednji dan.

Preberi
CSS: attr()

CSS: attr()

CSS značka attr() nam omogoča, da določenemu nizu dodamo dodatno pojasnilo oz. opis. Običajno smo takšno funkcionalnost imenovali z besedo “tooltip”, prikaže pa se z prehodom miške na desktop računalniku ali klikom na mobilni napravi.

Preberi
CSS: prefers-reduced-motion

CSS: prefers-reduced-motion

Media značke niso le “screen” in “print”, na voljo imamo tudi druge. Ena takšnih je CSS media značka “prefers-reduced-motion”, ki se uporablja za zaznavanje, če je uporabnik zahteval, da sistem zmanjša količino animacij ali gibanja, ki se uporablja na strani.

Preberi