Sintaxa CSS

Un selector și un bloc de declarații sunt cele două părți ale oricărei reguli CSS.

Selectorul alege elementul HTML de stilizat.

Acoladele încadrează blocul de declarații, care conține una sau mai multe declarații cu punct și virgulă între ele.

O declarație asociază un nume de proprietate CSS cu o valoare, folosind două puncte pentru a le separa.

Exemplu

Această regulă centrează fiecare element <p> și îi colorează textul în roșu.

O pagină web cu CSS într-un bloc `<style>` care vizează toate elementele `<p>`.

Faceți fiecare paragraf roșu și aliniat la centru. Includeți câteva paragrafe pentru ca regula să fie vizibilă.

> Output: pagină HTML completă

Prompt

O pagină web cu CSS într-un bloc <style> care vizează toate elementele <p>. Faceți fiecare paragraf roșu și aliniat la centru. Includeți câteva paragrafe pentru ca regula să fie vizibilă.

Output: pagină HTML completă

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>CSS Syntax Example</title>
<style>
p {
  color: red;
  text-align: center;
}
</style>
</head>
<body>

<p>Every paragraph on this page is red and centered.</p>
<p>This is another paragraph styled by the same CSS rule.</p>

</body>
</html>

Explicația Exemplului

Selectorul este p, deci regula vizează elementul HTML <p>.
Proprietatea color are valoarea red.
Proprietatea text-align are valoarea center.

Capitolele următoare aprofundează mult mai mult selectorii și proprietățile CSS.