Comment utiliser le survol en CSS
En CSS, le survol permet de sélectionner l'élément sur lequel flotte le pointeur de la souris. La syntaxe est "label selector:hover{style code;}". element; 2. Changer le style des éléments enfants; 3. Changer le style des éléments frères 4. Changer le style des éléments proches, etc.
Il existe un attribut de survol en CSS, qui peut être activé lorsque la souris est déplacée vers le haut. Il peut être utilisé pour implémenter certaines fonctions similaires à js. Ensuite, dans l'article, nous présenterons en détail comment utiliser l'attribut de survol. J'espère que cela vous sera utile.
[Cours recommandé : Tutoriel CSS]
Définition du survol
:sélecteur de survol Pour en sélectionnant l'élément sur lequel flotte le pointeur de la souris, il s'applique à tous les éléments
:hover Le sélecteur s'applique à tous les éléments
utilisation du survol
Utilisation 1 : Passez la souris sur l'élément pour changer le style de l'élément
Exemple : Lorsque la souris survole la police, la couleur de la police change
<style>
h1:hover{
color: pink;
}
</style>
</head>
<body>
<h1>PHP中文网</h1>
</body>Rendu :
C'est l'utilisation la plus courante, elle change simplement le style
Utilisation 2 : Contrôlez les styles des autres blocs en survolant
Cette utilisation peut être divisée selon les trois styles suivants
(1) Contrôler le style des sous-éléments
<style>
h1:hover p{
background-color: pink;
}
</style>
</head>
<body>
<h1>PHP中文网
<p>hover的用法</p>
</h1>Rendu :
(2) Contrôler le style des éléments frères
'+' Contrôler les éléments frères (éléments frères)
<style>
h1:hover+p{
background-color: pink;
}
</style>
</head>
<body>
<h1>PHP中文网</h1>
<p>hover的用法</p>Rendu :
(3) Contrôler le style des éléments à proximité
'~' Contrôler les éléments à proximité
<style>
h1:hover~p{
background-color: pink;
}
</style>
</head>
<body>
<h1>PHP中文网</h1>
<p>hover的用法</p>Rendu :
Résumé : Ce qui précède est l'intégralité du contenu de cet article, j'espère qu'il sera utile à tout le monde.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
AI Hentai Generator
Générez AI Hentai gratuitement.
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Astuce CSS : utilisez la transition pour conserver l'état de survol
Sep 27, 2022 pm 02:01 PM
Comment préserver l’état de survol ? L'article suivant vous expliquera comment conserver l'état de survol sans utiliser JavaScript. J'espère qu'il vous sera utile !
L'expérience vole. Prenez un vol avec la caméra Haval X1.
Jan 15, 2024 pm 02:21 PM
Nous pouvons souvent voir de superbes vidéos vues de haut en bas sur Internet. Les photos prises par les drones sont en effet assez choquantes. Cependant, en fait, de nombreuses personnes ont une connaissance limitée des drones, par exemple, pourquoi peuvent-ils encore voler dans certains endroits. où le vol est restreint ? En fait, les « drones » prêts à voler sont actuellement le courant dominant, et ils méritent davantage le choix de la plupart des gens. Aujourd'hui, je vais vous faire vivre une expérience pratique avec la Harvest Flying Camera X1. En termes d'apparence, la Harvest Flying Camera X1 a le premier design pliable. L'ensemble de l'appareil photo ne pèse que 125 g, ce qui est plus léger qu'un téléphone portable. Il peut être facilement tenu après pliage et peut être mis dans un sac sans aucune pression. Quatre feuilles teintes en douceur et un cadre de sécurité protègent parfaitement la sécurité du tir. Dyed Leaf utilise de manière innovante un substrat biologique biosourcé, hautement élastique, durable, sûr et respectueux de l'environnement. Il dispose également d'un cadre entièrement protecteur pour protéger vos mains pendant le décollage et l'atterrissage.
Comment supprimer l'événement de survol en CSS
Feb 01, 2023 am 10:06 AM
Méthodes pour supprimer les événements de survol CSS : 1. Via "$("a").hover(function(){ alert('mouseover'); }, function(){ alert('mouseout'); })" pour lier l'événement de survol ; 2. Dissociez l'événement de survol via la méthode "$('a').off('mouseenter').unbind('mouseleave');". Peut.
Le rôle du survol en HTML
Feb 20, 2024 am 08:58 AM
Le rôle du survol en HTML et exemples de code spécifiques Dans le développement Web, le survol signifie que lorsque l'utilisateur passe le curseur sur un élément, certaines actions ou effets sont déclenchés. Il est implémenté via la pseudo-classe CSS :hover. Dans cet article, nous présenterons le rôle du survol et des exemples de code spécifiques. Premièrement, le survol permet à un élément de changer de style lorsque l'utilisateur le survole. Par exemple, lorsque vous passez la souris sur un bouton, vous pouvez modifier la couleur d'arrière-plan ou la couleur du texte du bouton pour rappeler à l'utilisateur la marche à suivre.
Pourquoi le survol est un pseudo-élément
Oct 09, 2023 pm 05:45 PM
Hover n'est pas un pseudo-élément, c'est une pseudo-classe. Les pseudo-classes sont utilisées pour sélectionner un état ou un comportement spécifique d'un élément, tandis que les pseudo-éléments sont utilisés pour ajouter des styles à des parties spécifiques d'un élément. Parce que :hover est utilisé pour sélectionner un état spécifique d'un élément plutôt que d'ajouter des styles à une partie spécifique de l'élément, vous pouvez utiliser la pseudo-classe :hover pour styliser l'état de survol d'un élément, et vous pouvez utiliser le :hover pseudo-classe pour ajouter des effets de survol aux liens. La couleur du lien, la couleur d'arrière-plan, etc. peuvent changer lorsque la souris le survole.
Comment utiliser le survol en CSS
Feb 23, 2024 pm 12:06 PM
La pseudo-classe hover en CSS est un sélecteur très couramment utilisé qui permet de changer le style d'un élément lorsque la souris le survole. Cet article présentera l'utilisation du survol et fournira des exemples de code spécifiques. 1. Utilisation de base Pour utiliser le survol, nous devons d'abord définir un style pour l'élément, puis utiliser la pseudo-classe :hover pour spécifier le style correspondant lorsque la souris survole. Par exemple, nous avons un élément bouton Lorsque la souris survole le bouton, nous voulons que la couleur d'arrière-plan du bouton passe au rouge et la couleur du texte au blanc.
Comment utiliser le survol en CSS
Nov 24, 2023 am 10:32 AM
En CSS, :hover est un pseudo-sélecteur utilisé pour sélectionner les éléments survolés par le pointeur de la souris. Vous pouvez utiliser :hover pour appliquer certaines modifications de style lorsque l'utilisateur survole un élément.
Comment utiliser la méthode jQuery hover()
Dec 04, 2023 am 09:56 AM
hover() est une méthode couramment utilisée dans jQuery. Elle est utilisée pour lier deux fonctions de gestion d'événements. Ces deux fonctions seront exécutées lorsque le pointeur de la souris entre et quitte l'élément correspondant. La méthode d'utilisation de base est "$(selector).hover(inFunction,outFunction);".
