Generator online pentru CSS


Săptămâna trecută am vorbit despre două programe pentru lucrul cu CSS. Astăzi vă propun o soluţie online care, ca mai toate soluţiile online, nu poate înlocui un program specializat dar poate fi de mare folos în anumite situaţii. Mai ales pentru cei care nu ştiu pe de rost sintaxa CSS, CSS Builder propus de MetaTitan poate fi un instrument valoros. Sper însă să devină şi mai valoros în timp (aşteptăm de exemplu niscaiva AJAX pentru rapiditate şi eleganţă în generare) – aşa promite şi autorul, dar promisiunea "this tool will be improved over the coming days" nu s-a concretizat cel puţin în ultima săptămână de când ştiu de sit.

img245

Să vedem ce ne permite. Captura de mai jos nu respectă modul în care sunt dispuse elementele în pagina respectivă dar îmi uşurează prezentarea. Procesul presupune 4 paşi per element. Ce element? În căsuţa cu fundal negru puteţi indica manual un selector, cu un nume anume, sau alege din lista de deasupra. În exemplul surprins mai jos am mers pe definiţia pentru a:link (adică cum să arate linkurile nevizitate şi când mouse-ul nu este deasupra). În stânga vedeţi parametrii: sunt grupaţi pe taburi – Font/Text, Box Properties, Background, Positioning, List Properties. Evident, veţi folosi acei parametri care au legătură cu selectorul ales. La final, pasul trei, apăsaţi pe butonul Build It. Va fi generat un cod care, pasul 4, trebuie copiat şi folosit în fişierul CSS. Mda, v-aţi prins deja că procesul trebuie reluat pentru fiecare element în parte. Doar că dacă acum vrem să definim a:hover, setările anterioare au rămas deci putem de exemplu modifica doar font-weight să fie bold.

img246

CSS Builder nu este construit pentru cei care nu au habar o boabă de CSS, dar nici pentru cei care stăpânesc deja bine tema. Este însă util masei mari a webmasterilor, care au ideea, nu şi detaliul. Cred că o evoluţie interesantă a acestui instrument ar fi sa invalideze automat câmpurile din cele cinci taburi care nu au legătură cu selectorul ales (când nu este unul definit de utilizator).


Apreciază articolul:

1 stea2 stea3 stea4 stea5 stea (1 evaluări, media: 4,00 din 5)
Loading...Loading...

0 comentarii


Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile necesare sunt marcate *