Texte supprimé en HTML

Introduction

La balise HTML del est utilisée pour indiquer un texte supprimé dans un document. En utilisant la balise del, nous pouvons afficher le texte supprimé avec une barre de traversée. Ce laboratoire vous guidera sur la manière d'utiliser la balise HTML del pour créer un texte barré.

Note: Vous pouvez pratiquer la programmation dans index.html et apprendre Comment écrire du HTML dans Visual Studio Code. Cliquez sur 'Go Live' dans le coin inférieur droit pour exécuter le service web sur le port 8080. Ensuite, vous pouvez rafraîchir l'onglet Web 8080 pour prévisualiser la page web.

Skills Graph

Création d'un texte barré

Avant de commencer, créez un fichier HTML nommé index.html. Dans ce fichier, nous allons créer un texte barré en utilisant la balise HTML del.

Pour créer un texte barré, suivez ces étapes :

1. Ouvrez le fichier index.html dans votre éditeur de code
2. Ajoutez la balise HTML del (<del>) au texte que vous voulez barrer

   <p>The <del>quick</del> brown fox jumps over the lazy dog.</p>

   Dans l'exemple ci-dessus, le mot quick sera affiché barré.
3. Enregistrez le fichier index.html et ouvrez-le dans le navigateur.

Utilisation des attributs de la balise HTML del

La balise HTML del possède deux attributs importants : cite et datetime. Dans cette étape, nous allons voir comment utiliser ces attributs.

1. Ajout de l'attribut cite - Utilisez l'attribut cite pour indiquer l'URL d'un document décrivant le texte supprimé.

   <p>
     <del cite="http://www.example.com/reason-for-deletion.html"
       >The quick brown fox jumps over the lazy dog.</del
     >
   </p>

2. Ajout de l'attribut datetime - Utilisez l'attribut datetime pour indiquer l'heure à laquelle le texte a été supprimé.

   <p>
     <del datetime="2022-09-03T17:12:02Z"
       >The quick brown fox jumps over the lazy dog.</del
     >
   </p>

Création d'un texte barré avec un texte inséré

Souvent, lorsqu'on supprime du texte d'une page web, on peut vouloir insérer un autre texte à la place. Dans cette étape, nous allons voir comment utiliser la balise ins pour afficher un texte inséré.

1. Ouvrez le fichier index.html dans votre éditeur de code
2. Ajoutez la balise HTML ins au texte inséré qui remplace le texte supprimé.

   <p>The <del>quick</del> <ins>brown</ins> fox jumps over the lazy dog.</p>

   Dans l'exemple ci-dessus, le mot « quick » sera affiché barré, et le mot « brown » sera affiché comme un texte inséré.

Ajout de styles CSS à la balise HTML del

Le style CSS par défaut de la balise HTML del est une barre de traversée. Vous pouvez modifier le style CSS selon vos besoins.

1. Ajoutez le code CSS suivant à votre fichier HTML pour modifier le style par défaut de la balise del.

   <style>
     del {
       color: red;
       text-decoration: line-through;
     }
   </style>

Dans l'exemple ci-dessus, la couleur de la balise del a été changée en rouge.

Récapitulatif

Créer un texte barré en utilisant la balise HTML del est facile. Dans ce laboratoire, vous avez appris à utiliser la balise HTML del pour créer un texte barré, ajouter des attributs à la balise del, utiliser la balise ins pour l'insertion et modifier le style CSS de la balise del.