Informatică Dezvoltare web
Cum se stilizeaza cu CSS exemple?
CSS (Cascading Style Sheets) stilizează elementele HTML prin aplicarea de reguli care controlează aspectul, cum ar fi culori, fonturi sau dimensiuni. Pentru a stiliza cu CSS, se pot folosi selectori pentru a ținti elemente și proprietăți pentru a seta valori specifice. Exemplu: p { color: blue; } schimbă culoarea textului tuturor paragrafelor la albastru.
Metode comune de stilizare cu CSS
- Selector de tip Țintește toate elementele de un anumit tip. Exemplu: h1 { font-size: 24px; }.
- Selector de clasă Aplică stiluri elementelor cu o clasă specifică. Exemplu: .highlight { background-color: yellow; }.
- Selector de ID Țintește un element unic cu un ID. Exemplu: #header { color: red; }.
- Proprietăți de bază color pentru culoarea textului, background-color pentru fundal, margin și padding pentru spațiere.
Exemplu practic de stilizare
- 1 Pasul 1: Adaugă CSS într-un fișier HTML În <head>, include un tag <style> sau un link către un fișier extern. Exemplu: <style> /* cod CSS aici */ </style>.
- 2 Pasul 2: Scrie reguli CSS body { font-family: Arial, sans-serif; background-color: #f0f0f0; } h1 { color: darkblue; text-align: center; } .button { padding: 10px; background-color: green; color: white; }
- 3 Pasul 3: Aplică stilurile în HTML <h1>Titlul meu</h1> <p>Acesta este un paragraf.</p> <button class="button">Apasă-mă</button>
Folosește selectori specifici pentru control precis; testează culorile și dimensiunile pe diferite dispozitive.