CSS Menu Builder


Titlul spune tot. CSSMenuBuilder.com este un sit ce vă permite crearea de meniuri. De care? Câte? Citim pe prima pagină: "30+ horizontal menus, 700+ vertical menus combinations and breadcrumb menus that consist of more than 200+ combinations – in total the site offers more than 1000 menu combinations not including the endless color combinations". Dacă vă impresionează cifrele atunci reveniţi puţin cu picioarele pe pământ: e vorba de combinaţii, gen iconiţă-săgetuţă combinată cu toate fundalurile, iconiţă-pătrăţele combinată cu toate fundalurile ş.a.m.d. În realitate există totuşi o paletă acceptabilă de opţiuni şi e de apreciat faptul că se oferă trei tipuri de meniuri: orizontal, vertical şi (din nou orizontal stil) breadcrumb – acoperind o paletă largă de nevoi.

img273

Oricare variantă aţi alege, paşii sunt aceeaşi: puteţi alege un (tip de) fundal pentru butoane, apoi o imagine de "înfrumuseţare" per buton, după care aveţi posibilitatea să setaţi culorile, cam tot ce se poate (gradiente, fundal de pagină…). La final puteţi lua pe bucăţele codul HTML, codul CSS şi imaginie, sau descărca o arhivă cu toate cele necesare incluse. Desigur că în unele cazuri lucrurile pot decurge perfect, rezumându-se la copy & paste (la partea HTML veţi schimba, se înţelege, textele butoanelor şi veţi adăuga oricâte în plus, multiplicând o linie <li>…</li>). Dar cel mai adesea cred că vor trebui şi modificări suplimentare, poate în special la dimensiunea butoanelor, implicit late de 300 de pixeli (cam mult, nu?). Dacă sunteţi adepţii rezolvării singuri a meniurilor dar sunteţi începători în ale CSS-urilor atunci merită să aruncaţi o privire peste cod pentru a vedea cum abordează acest sit problema (veţi vedea că se oferă o singură imagine, ce se utilizează şi la starea activă şi la cea inactivă şi la cea de mouse-deasupra… cum aşa? prin poziţionarea cu CSS a imaginii).

img274 img275


Apreciază articolul:

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

0 comentarii


Lasă un răspuns

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