Comment changer la couleur d'une div en survolant la souris

Auteur: Morris Wright
Date De Création: 27 Avril 2021
Date De Mise À Jour: 1 Peut 2024
Anonim
Comment changer la couleur d'une div en survolant la souris - Des Articles
Comment changer la couleur d'une div en survolant la souris - Des Articles

Contenu

Les balises DIV (une abréviation de "split") définissent une section d'un document HTML et sont souvent utilisées avec le langage CSS pour créer la mise en page de base d'un site. Une DIV peut être personnalisée à l'aide de CSS pour définir les marges, l'espacement, les contours, la taille du texte, l'alignement ou la couleur d'arrière-plan, ainsi que des astuces plus pointues, telles que la modification de la couleur de la DIV lorsqu'un utilisateur la survole.


Les instructions

Le langage CSS vous permet d'appliquer des astuces pour améliorer l'interaction de l'utilisateur avec la page. (Comstock / Comstock / Getty Images)
  1. Ouvrez le document à partir de votre page Web dans un éditeur de texte.

  2. Placez le curseur sur une ligne vide entre le "et'.

  3. Tapez "type = 'text / css'>" et appuyez sur "Entrée". Avec cela, vous allez commencer à créer un script CSS.

  4. Tapez "# div1: hover {background-color: # ff0000;}" et appuyez sur "Entrée". Cela va personnaliser un conteneur DIV avec la valeur "div1" comme propriété ID en utilisant la couleur d'arrière-plan "# ff0000" (une valeur hexadécimale) lorsque l'état "survol" est activé, ce qui se produira lorsque le curseur de la souris est placé sur la DIV. Ces valeurs d'ID et de couleur d'arrière-plan peuvent être modifiées si nécessaire.


  5. Type ""fermer la balise de script CSS.

  6. Placez le curseur de texte sur une ligne vide entre les balises "" et "".

  7. Tapez "" et appuyez sur "Entrée" pour créer un conteneur DIV avec l'ID "div1". Si vous avez changé le nom de l'ID à l'étape 4, vous devez y mettre le même nom.

  8. Tapez ou collez un contenu à inclure dans la DIV et appuyez sur "Entrée".

  9. Tapez "" pour fermer le conteneur DIV.

  10. Cliquez sur "Fichier" et "Enregistrer" pour enregistrer le document.