Limbajul CSS
CSS Introducere
CSS este un limbaj care descrie stilul unui document HTML. CSS descrie modul în care trebuie afișate elementele HTML. CSS reprezintă Cascading Style...
CSS Sintaxă
Un set de reguli CSS constă dintr-un selector și un bloc de declarații. Selectorul indică elementul HTML pe care doriți să-l creeze în stil. Blocul...
CSS Selectori
Selectoarele CSS sunt utilizate pentru a „găsi” (sau a selecta) elementele HTML pe care doriți să le modelați. Putem împărți selectorii CSS în cinci...
Cum să adăugați CSS
Când un browser citește o foaie de stil, acesta va format documentul HTML în conformitate cu informațiile din foaia de stil. Trei modalități de a ins...
Culori CSS
Culorile sunt specificate folosind nume de culori predefinite sau valori RGB, HEX, HSL, RGBA, HSLA. Nume de culoare CSS. În CSS, o culoare poate fi...
CSS Fundaluri
Proprietățile de fundal CSS sunt utilizate pentru a defini efectele de fundal pentru elemente. Proprietăți de fundal CSS: culoare de fundal, imagine...
CSS Borders
Proprietăți CSS Borders. Proprietățiile CSS Borders vă permit să specificați stilul, lățimea și culoarea chenarului unui element. CSS Border Style....
CSS Margini
Proprietățiile CSS margin sunt utilizate pentru a crea spațiu în jurul elementelor, în afara oricărui chenar definit. Cu CSS, aveți control complet a...
CSS Padding
Proprietățiile CSS padding sunt utilizate pentru a genera spațiu în jurul conținutului unui element, în interiorul oricărui chenar definit. Cu CSS, a...
CSS Height și Width
Proprietățiile height și width sunt utilizate pentru a seta înălțimea și lățimea unui element. Proprietățiile height și width nu includ padding, bord...
CSS Box Model
Toate elementele HTML pot fi considerate casete (boxes). În CSS, termenul „model de cutie”(box model) este utilizat atunci când vorbim despre design ș...
CSS Outline
Un outline este o linie care este desenată în jurul elementelor, în afara granițelor (borders), pentru a face ca elementul să „iasă în evidență”. CSS...
CSS Text
Proprietatea de culoare este utilizată pentru a seta culoarea textului. Culoarea este specificată de: un nume de culoare - ca „roșu” o valoare HEX -...
CSS Fonturi
Proprietățiile fontului CSS definesc font family, boldness, size și style of a text. Familii de fonturi CSS (CSS Font Families). În CSS, există două...
CSS Icons
Cum se adaugă icoane Cel mai simplu mod de a adăuga o pictogramă pe pagina dvs. HTML, este cu o bibliotecă de pictograme, cum ar fi Font Awesome. Ad...
CSS Link-uri
Cu CSS, linkurile pot fi proiectate în moduri diferite. Styling Links. Linkurile pot fi realizate cu orice proprietate CSS (de exemplu, culoare, fam...
CSS Liste
În HTML, există două tipuri principale de liste: liste neordonate (<ul>) - articolele din listă sunt marcate cu buline. liste ordonate (<ol>) - elem...
CSS Tabele
Aspectul unui tabel HTML poate fi îmbunătățit mult cu CSS. Bordurile tabelelor Pentru a specifica bordurile tabelelor în CSS, utilizați proprietatea...
CSS Display
Layout CSS - Proprietatea display Proprietatea display este cea mai importantă proprietate CSS pentru controlul aspectului. Proprietatea display Pr...
CSS max-width
CSS Layout - width și max-width. Utilizarea width, max-width și margin: auto; Așa cum am menționat în capitolul precedent; un element la nivel de b...
CSS Position
CSS Layout - Proprietatea position Proprietatea position specifică tipul metodei de poziționare utilizate pentru un element (static, relativ, fix, a...
CSS Overflow
Proprietatea CSS overflow controlează ce se întâmplă cu conținutul prea mare pentru a se încadra într-o zonă. CSS Overflow Proprietatea de overflow...
CSS Float
Proprietatea CSS float specifică modul în care un element ar trebui să plutească (float). Proprietatea CSS clear specifică ce elemente pot pluti (f...
CSS inline-block
The display: inline-block Value În comparație cu display: inline, diferența majoră este aceea că display: inline-block permite să stabilească o lățim...
CSS Align
CSS Layout - Aliniere orizontală și verticală Elemente de aliniere de centru Pentru a centra orizontal un element de block (cum ar fi <div>), utiliz...
CSS Combinatoare
Un combinator este ceva care explică relația dintre selectori. Un selector CSS poate conține mai mult de un simplu selector. Între selectoarele simpl...
CSS Pseudo-clase
Ce sunt Pseudo-clasele? O pseudo-clasă este utilizată pentru a defini o stare specială a unui element. De exemplu, poate fi folosit pentru: Stileaz...
CSS Pseudo-elemente
Un pseudo-element CSS este utilizat pentru a stabili părțile specificate ale unui element. De exemplu, poate fi folosit pentru: Stilizarea primei li...
CSS Opacitate / Transparență
Proprietatea opacity specifică opacitatea / transparența unui element. Imagine transparentă Proprietatea opacity poate lua o valoare între 0,0 și 1,...
CSS Bară de navigare
Bare de navigare Navigarea ușor de utilizat este importantă pentru orice site web. Cu CSS puteți transforma meniuri HTML plictisitoare în bare de na...
CSS Dropdowns
Basic Dropdown Creați un dropdown box care apare când utilizatorul mută mouse-ul peste un element. HTML) Utilizați orice element pentru a deschide c...
CSS Galerie de imagini
CSS poate fi utilizat pentru a crea o galerie de imagini.
CSS Image Sprites
Image Sprites Un image sprite este o colecție de imagini puse într-o singură imagine. O pagină web cu multe imagini poate dura mult timp pentru a se...
CSS Selectori de atribute
Selectori de atribute CSS. Elemente de stil HTML cu atribute specifice. Este posibil să stilăm elemente HTML care au atribute specifice sau valori d...
CSS Formulare
Formulare CSS Aspectul unui formular HTML poate fi îmbunătățit mult cu CSS. Stilizarea câmpurilor de intrare (Styling Input Fields) Utilizați propr...
CSS Contoare
Contoare CSS Contoarele CSS sunt „variabile” menținute de CSS ale căror valori pot fi incrementate prin reguli CSS (pentru a urmări de câte ori sunt...
CSS Website Layout
Website Layout Un site web este adesea împărțit în anteturi, meniuri, conținut și un subsol(headers, menus, content și footer). Antet (Header) Un a...
CSS Unități
Unități CSS CSS are mai multe unități diferite pentru exprimarea unei lungimi. Multe proprietăți CSS iau valori „de lungime” (lenght), cum ar fi lăț...
CSS Specificitate
Specificitatea CSS Dacă există două sau mai multe reguli CSS conflictuale care indică același element, browserul respectă câteva reguli pentru a dete...
CSS Colțuri rotunjite
CSS Colțuri rotunjite Cu proprietatea CSS border-radius, puteți da oricărui element "colțuri rotunjite" (rounded corners). Proprietate CSS border-ra...
CSS Border Images
CSS Border Images Cu proprietatea CSS border-image, puteți seta o imagine care să fie utilizată ca border în jurul unui element. Proprietatea CSS bo...
CSS Fundaluri multiple
În acest capitol veți învăța cum să adăugați mai multe imagini de fundal la un element. Proprietățiile background-size, background-origin, background...
CSS Culori
Culori CSS CSS acceptă 140+ nume de culoare, valori HEX, valori RGB, valori RGBA, valori HSL, valori HSLA și opacitate. Culori RGBA Valorile de cul...
CSS Gradienți
Gradienți CSS Gradienții CSS vă permit să afișați tranziții netede între două sau mai multe culori specificate. CSS definește două tipuri de gradien...
CSS Efecte de umbră
Efecte de umbră CSS Cu CSS puteți adăuga umbră textului și elementelor. Proprietăți: text-shadow, box-shadow. Umbre multiple (Multiple Shadows) Pe...
CSS Efecte de text
CSS Text Overflow, Word Wrap, Line Breaking Rules și Writing Modes Proprietăți: text-overflow, word-wrap, word-break, writing-mode CSS Text Overflow...
CSS Fonturi Web
Fonturi Web CSS Regula CSS @ font-face Fonturile web permit proiectanților web să utilizeze fonturi care nu sunt instalate pe computerul utilizatoru...
CSS Transformări 2D
Transformări 2D CSS Transformările CSS vă permit să vă deplasați, să rotiți, să scalați și să înlăturați elemente. Proprietăți CSS: transform. Asis...
CSS Transformări 3D
CSS Transformări 3D CSS acceptă, de asemenea, transformări 3D. În acest capitol veți afla despre următoarele proprietăți CSS: transform Asistență b...
CSS Tranziții
Tranziții CSS Tranzițiile CSS vă permit să modificați valorile proprietății fără probleme, pe o durată dată. În acest capitol veți afla despre următ...
CSS Animații
Animații CSS CSS permite animarea elementelor HTML fără a utiliza JavaScript sau Flash! În acest capitol veți afla despre următoarele proprietăți: @...
CSS Tooltip
CSS Tooltip Creați tooltips cu CSS. Un tooltip este adesea folosit pentru a specifica informații suplimentare despre ceva când utilizatorul mută ind...
CSS Stilizarea imaginilor
CSS Stilizarea imaginilor (CSS Styling Images) Imagini rotunjite (Rounded Images) Utilizați proprietatea border-radius pentru a crea imagini rotunji...
CSS Butoane
Butoane CSS Aflați cum puteți stabili butoanele folosind CSS. Stilarea butonului de bază (Basic Button Styling) Culorile butoanelor (Button Colors)...
CSS Paginare
CSS Paginare Aflați cum puteți crea o paginare responsive folosind CSS. Paginare simplă Dacă aveți un site web cu o mulțime de pagini, poate doriți...
CSS Coloane multiple
CSS Coloane multiple Layout cu mai multe coloane CSS( CSS Multi-column Layout) Aspectul cu mai multe coloane CSS (multi-column layout) permite defin...
CSS Interfață utilizator
CSS Interfață utilizator În acest capitol veți afla despre următoarele proprietăți ale interfeței de utilizator CSS: resize, outline-offset Asistenț...
CSS Variabile
Variabile CSS Proprietăți CSS personalizate (variabile) Funcția var() poate fi utilizată pentru a insera valoarea unei proprietăți personalizate. A...
CSS Box Sizing
CSS Box Sizing Proprietatea CSS box-sizing ne permite să includem padding și border în lățimea și înălțimea totală (width și height) a unui element....
CSS Interogări media
CSS Interogări media (CSS Media Queries) CSS2 Tipuri de suport introduse (CSS2 Introduced Media Types) Regula @media, introdusă în CSS2, a făcut pos...
CSS Flexbox
CSS Flexbox CSS Modulul Flexbox Layout (CSS Flexbox Layout Module) Înainte de modulul Layout Flexbox, existau patru moduri de aspect: Block, pentru...
CSS Interogări media - Exemple
Interogări media CSS - exemple Interogările media sunt o tehnică populară pentru livrarea unei foi de stil adaptate diferitelor dispozitive. Pentru a...
CSS Responsive Web Design - Introducere
Responsive Web Design - Introducere Ce este Responsive Web Design? Responsive web design face ca pagina dvs. web să arate bine pe toate dispozitivel...
CSS Responsive Web Design - Viewport
Responsive Web Design - Viewport Ce este Viewport? Viewport este zona vizibilă a utilizatorului unei pagini web. Viewportul variază în funcție de d...
CSS Responsive Web Design - Grid-View
Responsive Web Design - Grid-View Ce este un Grid-View? Multe pagini web se bazează pe un grid-view, ceea ce înseamnă că pagina este împărțită în co...
CSS Responsive Web Design - Interogări media
Responsive Web Design - Interogări media Ce este o interogare media? Interogarea media este o tehnică CSS introdusă în CSS3. Utilizează regula @med...
CSS Responsive Web Design - Imagini
Responsive Web Design - Images Utilizarea proprietății Width Dacă proprietatea lățimii (width) este setată la un procent și înălțimea este setată la...
CSS Responsive Web Design - Videoclipuri
Responsive Web Design - Videoclipuri Utilizarea proprietății width Dacă proprietatea lățimii (width) este setată la 100%, playerul video va răspunde...
CSS Responsive Web Design - Frameworks
Responsive Web Design - Frameworks Există multe CSS Frameworks existente care oferă un design responsive. Sunt gratuite și ușor de utilizat. Folosi...
CSS Grid Introducere
CSS Grid Layout Module Grid Layout CSS Grid Layout Module oferă un sistem de dispunere bazat pe grilă, cu rânduri și coloane, ceea ce facilitează pr...
CSS Grid Container
Grid Container Pentru a face ca un element HTML să se comporte ca un container grid, trebuie să setați proprietatea display la grid sau la inline-gri...
CSS Grid Item
CSS Grid Item Child Elements (Items) Un container grid conține elemente grid. În mod implicit, un container are un articol grid pentru fiecare colo...
CSS object-fit
Proprietatea CSS object-fit Proprietatea CSS object-fit este utilizată pentru a specifica modul în care un <img> sau <video> trebuie redimensionat pe...