Code

Page exemple

Méthode 1

  1. créer un dossier intitulé html

    ce dossier est spécial car il va contenir tous les fichiers .html : en informatique, ce dossier est appelé dossier racine, root folder ou directement root

    ce dossier peut être créé n'importe où dans votre ordinateur

  2. dans le root, créer une fichier intitulé index.html

    Le nom du fichier est important : il s'agit du fichier par défaut par un serveur Apache

  3. Dans ce même dossier, créer un fichier intitulé style.css
    Le nom du fichier peut être différent (main.css, mise-en-forme.css)

  4. ouvrir le fichier index.html avec Notepad++
  5. écrire le code html de base
  6. Dans le <head> de la page index.html , ajouter la balise orpheline <link rel="stylesheet" href="style.css"/>
  7. Veuillez à l'encodage des deux fichiers : dans le menu de Notepad++ cliquer sur Encodage > Encoder UTF-8 (sans BOM)
  8. Enregistrer avec une Ctrl+S

  9. Visualiser le résultat dans votre navigateur : dans le menu de Notepad++ cliquer sur Exécution > Launch in Firefox

Méthode 2

  1. créer un nouvel onglet
  2. Définir le langage : dans Notepad++ cliquer sur Langage > H > HTML
  3. Ecrire le code html d'une page de base
  4. Dans le <head> de la page html, ajouter la balise orpheline <link rel="stylesheet" href="style2.css"/>
  5. veuillez à l'encodage du fichier : dans le menu de Notepad++ cliquer sur Encodage > Encoder UTF-8 (sans BOM)

  6. Enregistrer avec une Ctrl+S

    Sélectionner le dossier root, et intitulé ce fichier index2.html

  7. créer deuxième onglet
  8. Définir le langage : dans Notepad++ cliquer sur Langage > C > CSS
  9. veuillez à l'encodage du fichier : dans le menu de Notepad++ cliquer sur Encodage > Encoder UTF-8 (sans BOM)

  10. Enregistrer avec une Ctrl+S

    • Sélectionner le dossier root, et intitulé ce fichier style2.css
    • le fichier style2.css doit être à côté de index2.html

  11. Visualiser le résultat dans votre navigateur : dans le menu de Notepad++ cliquer sur Exécution > Launch in Firefox