Pomagalnik

Pomagalnik

Strokovnjak za digitalne medije.

Obajve za tag "Cascading Style Sheets"

CSS LINT – CSS pregledovalnik

CSS Lint je on-line orodje, ki nam olajša izdelavo pravilne CSS kode. Opravi nam osnovni pregled sintakse in ponuja dodatne možnosti pregledovanja, ki iščejo problematične dele ali neskladnosti. Vse dodatne možnosti pregledovanja je možno izklapljati, tako da lahko preverjanje omejimo le na tiste, ki želimo.

Preberi do konca - CSS LINT – CSS pregledovalnik

Kako vertikalno poravnamo sliko z besedilom v CSSju

Pri ustvarjanju različnih spletnih projektov se velikokrat srečamo z različnimi poravnavami slike z besedilom v vrstici. Na voljo imamo več možnosti in sicer zgoraj (top), sredinsko (middle), spodaj (bottom) in rob (baseline). Slednje pa enostavno določimo preko class-a, ki ga dodelimo sliki.

Preberi do konca - Kako vertikalno poravnamo sliko z besedilom v CSSju

ProCSSor – enostavno do urejenih CSS datotek

CSS datoteke lahko oblikujemo na več različnih načinov. Pravilno oblikovanje pa nam omogoča enostavno vzdrževanje in editiranje CSS značk. Velikokrat pa zaradi takšnih ali drugačnih razlogov zanemarimo pravilno oblikovanje in CSS datoteke postanejo prava zmešnjava. V takšnih primerih pa nam pride prav “on-line” aplikacija ProCSSor.

ProCSSor

Preberi do konca - ProCSSor – enostavno do urejenih CSS datotek

CSS znački: First-child in Last-child

First-child in Last-child so precej neznane CSS značke, ki so zelo uporabne za oblikovanje besedil in navigaciji spletnih strani. V praksi lahko npr. prvemu odstavku v besedilu enostavno določimo still brez določanja posebnih klasov (class) ali poseganja v HTML del. Prav tako lahko v navigaciji, ki so zgrajene s pomočjo seznamov (buletov) določimo poseben stil prvemu in zadnjemu vnosu – npr. drugačen zaključek, … možnosti je skratka ogromno.

Preberi do konca - CSS znački: First-child in Last-child

CSS značka: white-space

CSS značka »white-space« določa kako se besedilo oz. prostor v elementu obnaša.

Primer kode odstavka (<p> </p>), kjer se besedilo nikoli ne bo prelomilo.

P { white-space:nowrap; }

Preberi do konca - CSS značka: white-space