Ce este CSS?
Paginile web își primesc stilul de la CSS, un limbaj creat pentru acest scop.
- Numele este prescurtarea de la Cascading Style Sheets.
- CSS descrie cum arată elementele HTML pe ecran, pe hârtie sau în alte medii.
- Un singur set de reguli poate controla aspectul mai multor pagini web deodată, ceea ce îți economisește mult efort.
- Foile de stil externe sunt stocate în fișiere CSS.
Demo CSS - O pagină HTML - Stiluri multiple!
Dacă schimbi doar CSS-ul, aceeași pagină poate arăta complet diferit. Aici, o pagină HTML este afișată cu patru foi de stil diferite.
De ce să folosim CSS?
Paginile tale web își primesc stilurile de la CSS: designul, aspectul și modul în care arată o pagină pe diferite dispozitive și dimensiuni de ecran.
Exemplu CSS
Corpul, titlul și paragrafele acestei pagini sunt toate stilizate cu CSS.
Prompt
O pagină web simplă stilizată cu CSS într-un bloc
<style> din head.
Setați fundalul paginii la albastru deschis. Faceți <h1> alb și centrat. Dați paragrafelor fontul verdana la 20px. Includeți un titlu și un paragraf scurt pentru ca stilurile să fie vizibile.
Rezultat: pagină HTML completă "}, {
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>CSS Example</title>
<style>
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
p {
font-family: verdana;
font-size: 20px;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph. CSS sets the colors, fonts, and layout.</p>
</body>
</html>
CSS economisește mult efort!
Regulile CSS se află de obicei într-un fișier .css extern.
Când un întreg site web folosește o singură foaie de stil externă, editarea doar a acelui fișier schimbă aspectul fiecărei pagini.