Lecția 5: Introducere în CSS

1. Ce este CSS?

CSS (Cascading Style Sheets) este limbajul folosit pentru stilizarea și aranjarea elementelor HTML pe pagină. Cu CSS, controlăm culorile, fonturile, spațierile, alinierea, dimensiunile și multe altele.

2. Exemplu simplu de CSS inline

<h2 style="color: #E44D26; font-family: Arial; text-align: center;">
    Salut, lume!</h2>
            

Salut, lume!

3. CSS intern (în <style>)

<style>
    p {
        color: #CC0000;
        font-size: 18px;
        text-align: justify;
    }
</style>

<p>Acesta este un paragraf stilizat cu CSS intern.</p>
            

Acesta este un paragraf stilizat cu CSS intern.

4. CSS extern (linkat)

Se recomandă folosirea unui fișier CSS separat pentru organizare și reutilizare.

<link rel="stylesheet" href="stil.css">
        

În fișierul stil.css:

body {
    background-color: #FFF3CD;
    color: #CC0000;
    font-family: Calibri, sans-serif;
}
.box {
    width: 150px;
    height: 100px;
    background-color: #E44D26;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}
        

5. Exemplu Box Stilizat

Box Stilizat CSS

În lecția următoare: Vom începe să scriem JavaScript pentru pagini web!