Articole din categoria CSS
In ultimii ani am asistat la un boom in ceea ce priveste utilizarea dispozitivelor (smartphone, tablet) pentru navigarea pe internet. Recunoscand acest trend, dezvoltatorii s-au axat initial pe realizarea site-urilor dedicate pentru telefoanele mobile. Succesiv s-a trecut la realizarea site-urilor web care se adapteaza la orice rezolutie de ecran si anume site-urile web responsive. In […]
In acest tutorial video vom vedea cum putem insera imagini intr-un meniu Spry in Adobe Dreamweaver. Versiune Dreamweaver Pentru realizarea tutorialului a fost folosita versinea CS6 a programului Dreamweaver. In vesiunea succesiva a programului elemntele Spry au fost inlocute cu elementele jQuery User Interface pentru meniu de tip dropdown, iar acest tip de meniu Spry […]
Tutorial video creare galerie de imagini cu tranzitiile CSS In acest tutorial video vom vedea cum putem crea o galerie de imagini personalizata 100% pentru site-ul nostru web. O vom crea in mod foarte simplu utilizand tranzitiile CSS3 pe care ni le pune la dispozitie programul Adobe Dreamweaver. Ce sunt tranzitiile CSS Tranzitiile CSS cuprind […]
Plugin pentru galerie de imagini In acest tutorial video vom vedea cum sa realizam o galerie de imagini utilizand plugin-ul javascript Lightbox. Acesta este unul dintre plugin-urile gratuite (open source) cele mai utilizate pentru realizarea galeriilor de imagini pentru web si poate fi descarcat direct de pe site-ul web al producatorului: Lokesh Dhakar. In dosarul […]
Imagine de fundal fullsize cu CSS In acest tutorial vom vedea cel mai simplu mod in care putem seta o imagine de fundal site-ului nostru care sa ocupe tot ecranul. Imagine care se va adapta intotdeauna rezolutiei browser-ului pe care este vizualizat site-ul. Pentru a pune in practica acest lucru vom gasi pe internet nenumarate […]
In articolele precedente am vazut ce este o imagine vectoriala SVG, cum se poate aceasta obtine si cum putem integra o imagine SVG intr-un document HTML. Am vazut ca avem posibilitatea de a insera codul XML ce genereaza imaginea SVG direct in pagina HTML. Astfel este foarte usor sa personalizam variile elemente vectoriale ce o […]
Ce este SASS? Este un pre-procesor CSS (extensie CSS) care permite utilizarea unui limbaj mult mai puternic si inteligent decat simplul CSS. Odata ce este compilat acesta va genera fisierul CSS care va putea fi folosit pentru aplicatia web in mod normal. Alternativele la Sass sunt: Less si Stylus si acestea fiind utilizate pentru acelasi scop. SASS […]
Ce sunt regulile CSS Inline: Sunt acele reguli CSS care sunt aplicate elementelor direct in codul html al paginii. Acestea se pot aplica oricarui element html din pagina. Sintaxa: Regulile CSS inline se scriu in acelasi fel ca si in foia de stil dar in acest caz sunt scrise pe aceeasi linie separate ca si […]
Cu ajutorul regulilor de stil CSS putem defini si acele elemente care nu se regasesc efectiv in codul paginii. Pentru acest scop putem folosi pseudo-elementele. In schimb pentru formatarea fazelor unui element existent vom folosi pseudo-clasele. Vom incepe analiza noastra cu pseudo-elementele pentru ca apoi sa vedem diferentele dintre acestea si pseudo-clasele prevazute in standardul […]
De default culoarea de selectie in browser a continutului unei pagini web este acest albastru deschis din imaginea de mai jos. Daca vrem sa personalizam aceasta culoare pentru site-ul nostru web putem folosi declaratia CSS ::selection in care specificam noua culoare, ca mai jos: ::selection {background:#57d2fb;} ::-moz-selection {background:#57d2fb;} Culoarea pe care o dam selectiei este […]
In acest tutorial vom vedea cum putem crea un efect interesant de hover gradual asupra imaginilor utilizand tranzitiile CSS3. Pentru scrierea tranzitiilor vom folosi programul Adobe Dreamweaver. Ce sunt tranzitiile CSS 3 Tranzitiile sunt efecte care permit trecerea graduala a elementelor din pagina web de la o formatare la o alta, de la un set […]
