html-css/index.html at master · lanitro/html-css · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<!--DOCTYPE est la premiere balise obligatoire dans une page HTML: elle designe le type de document pour le navigateur => ici HTML-->
<html lang="fr">
    <!-- la balise HTML contient toute la page HTML interpretée pr le navigateur, le developpeur code TOUT entre la balise ouvrante et la fermante-->
    <!--l'attribut LANG de la balise html designe la langue utilisée côté internaute-->
    <head>
        <!--HEAD contient les parametres de la page HTML qui sont invisiblea l'affichage pour l'internaute-->
        <meta charset="UTF-8">
        <!-- encodage des caracteres pour la gestion de l'affichage des caracteres speciaux-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0" >
    <!--controler la mise en page sur les navigateurs mobiles, ici le 1.0 signifie qu'il n'y a pas de zoom mobile-->
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!--compatibilité avec le navigateur Edge -->
    <meta name="description" content="Ma 1ere page HTML">
    <!-- description qui apparait sous le nom du site dans le moteur de recherche-->
    <meta name="author" content="Mila developpeur integrateur">
    <!--auteur du site-->
    <title></title>
    <title>1ere page </HTML></title>
        <!--titre de la page => s'affiche dans l'onglet du navigateur-->

        <link rel="stylesheet" href="css/01_index.css">
         <!-- relie le fichier de style du fichier HTML -->
         <link href="https://fonts.googleapis.com/css?family=Shrikhand" rel="stylesheet">
    </head>

    <body>
        <!--TOUT ce qui sera affiché à l'ecran s'ecrit entre la balise ouvrante et la fermante de BODY-->
    hello my name is mohamed le navigateur affiche le texte, les image... contenus dans ma balise html &lt; </body>
<!-- &lt; permet d'afficher une balise html sans l'interpreter-->


    <!--les titres-->
    <h1>TITRE</h1>
    <h2>TITRE</h2>
    <h3>TITRE</h3>
    <h4>TITRE/h4>
    <h5>TITRE</h5>
    <h6>TITRE</h6>
<!--les paragraphes-->
<p>les paragraphes sont entourés d'une balise &lt;pre>.</p>
<pre>un paragraphe preformaté avec &lt;pre>.</pre>


<!-- p>Lorem*2-->
<P><Lorem></Lorem>
<Lorem></Lorem>
<!--<br> permet de retourner à la ligne -->
<!--<hr> permet de faire un saut de ligne-->

<!--les mises en valeur-->
<!--STRONG => en gras-->
<p>bonjour ici c'est <strong>VLG 2018</strong> qui code !</p>
<!--MARK => surligné en jaune -->
<p>Bonjour ici c'est <mark>VLG 2018</mark>qui code !</p>

<!--Les listes-->
<!--à puces-->
<ul>
    <li>chat</li>
    <li>chien</li>
    <li>cheval</li>
</ul>
<!--numerotées-->
<ol>
    <li>chat</li>
    <li>chien</li>
    <li>cheval</li>
</ol>
<!-- les liens-->
<a href="https://fr.learnlayout.com/">Cliquer ici</a>

<!--les images-->
<img src="https://media.giphy.com/media/R97jJCEGEmh0I/giphy.gif" alt="Groot">

</body>
    </html>