Scribd Logo
Importer

Bienvenue sur Scribd !

  • Cours Élève CSS

    Transféré par

    yarfa763
    5 vues3 pages

    Titre original

    Cours_élève_CSS

    Copyright

    © © All Rights Reserved

    Formats disponibles

    PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    5 vues3 pages

    Cours Élève CSS

    Transféré par

    yarfa763

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 3

    HTML5 & CSS3 Mr. BEDOUI M.

    CSS3
    Qu'est-ce que CSS?
     CSS : Cascading Style Sheets
     CSS décrit la mise en forme appliquée dans une page web.

    Ajouter le style dans la balise

    Activité 01 : Saisir le code suivant:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Premiers tests du CSS</title>
    </head>
    <body>
    <h1> site web: HTML 5 et CSS3 </h1>
    <p style="color: blue;">site web: HTML 5 et CSS3</p>
    </body>
    </html>
    Ajouter le style dans la partie head
    Activité 02 :Saisir le code suivant:
    <html>
    <head><meta charset="UTF-8">
    <title>CSS3</title>
    <style>
    p{
    color: red;
    }
    </style>
    </head>
    <body>
    <p >site web: HTML 5 et CSS3</p>
    </body>
    </html>

    1
    2023/2024 2ème TI
    HTML5 & CSS3 Mr. BEDOUI M.
    Saisir le code suivant:
    <!DOCTYPE html>
    <html>
    <head>
    <style>
    h1, h2, p {
    text-align: center;
    color: red;
    }
    </style>
    </head>
    <body>
    <h1>Hello World!</h1>
    <h2>titre 2</h2>
    <p> paragraphe</p>
    </body>
    </html>
    Saisir le code suivant:
    <!DOCTYPE html>
    <html>
    <head>
    <style>
    *{
    text-align: right;
    color: green;
    }
    </style>
    </head>
    <body>

    <h1>Hello World!</h1>
    <h2>titre 2</h2>
    <p> paragraphe</p>

    </body>
    </html>

    Utiliser un identifiant pour le style dans la partie head

    Activité 03 :Saisir le code suivant:

    <html>
    <head><meta charset="UTF-8">
    <title>CSS3</title>
    <style>
    #para {
    color: green;
    }
    </style>
    </head>
    <body>
    <p id='para' >site web: HTML 5 et CSS3</p>
    </body>
    </html>

    2
    2023/2024 2ème TI
    HTML5 & CSS3 Mr. BEDOUI M.
    Utiliser un fichier style

     Lancer VS Code et créer un nouveau fichier.


     Enregistrer ce fichier par le nom style.css
     Activité 04: Saisir le code suivant:

    p {
    color: blue;
    }
     Dans le fichier page.html, sisir le code savant:

    <html>
    <head><meta charset="UTF-8">
    <title>CSS3</title>
    <link rel="stylesheet" href="style.css" />
    </head>
    <body>
    <p >site web: HTML 5 et CSS3</p>
    </body>
    </html>

    3
    2023/2024 2ème TI

    Vous aimerez peut-être aussi