Utilisez le panneau Assistance par IA pour le style afin de comprendre la mise en page globale d'un site Web, les styles d'éléments spécifiques et d'obtenir des correctifs générés par IA pour les bugs CSS.
Ouvrir le panneau "Assistance IA"
Le panneau Assistance par IA s'ouvre dans le volet.
Depuis le panneau "Elements"
Pour ouvrir l'assistance IA à partir du panneau "Éléments", lorsque vous inspectez un nœud DOM, effectuez un clic droit sur le nœud, puis sélectionnez l'option Demander à l'IA.
Lorsque vous ouvrez l'assistance IA de cette manière, l'élément DOM inspecté est déjà présélectionné comme élément de contexte pour la conversation.
Vous pouvez également cliquer sur le bouton flottant associé à un nœud DOM sur lequel vous pointez.
Depuis le menu de commande
Pour ouvrir l'assistance IA à partir du menu de commande, saisissez AI
, puis exécutez la commande Afficher l'assistance IA, qui est associée au badge Réglages.
Dans le menu "Plus d'outils"
Vous pouvez également sélectionner
Plus d'options > Plus d'outils > Assistance par IA en haut à droite.Contexte de la conversation
Les discussions avec l'assistance par IA concernent toujours l'élément actuellement inspecté, qui est le dernier élément sélectionné dans l'arborescence DOM du panneau "Éléments". Une référence à cet élément s'affiche en bas à gauche du panneau.
Modifiez le contexte à l'aide du bouton de sélecteur d'éléments à côté de l'élément actuel ou en sélectionnant un élément dans l'arborescence DOM du panneau "Éléments".
Bien que l'élément actuellement inspecté constitue la base de la conversation, l'assistance par IA a accès à toutes les API Web pour recueillir plus d'informations sur la page inspectée. Cela inclut l'interrogation d'autres éléments avec document.querySelector
ou l'évaluation des styles calculés.
Invites
Lorsque vous démarrez une nouvelle conversation, l'assistance par IA pour le style propose des exemples d'invites pour vous aider à vous lancer rapidement.
Cliquez sur l'une des requêtes pour préremplir le champ de saisie de la requête en bas du panneau.
Vous pouvez également saisir votre propre requête ou question dans le champ de saisie.
Pour envoyer une invite, appuyez sur Enter
ou cliquez sur la flèche située à droite du champ de saisie.
Flux de conversation
L'envoi d'une requête lance la conversation avec l'agent de stylisation. Pour obtenir les informations nécessaires pour répondre au mieux à votre requête, l'agent génère et exécute du code JavaScript qui appelle des API Web. La progression de l'agent est affichée par étapes. L'état de l'étape initiale est Investigating…
.
Le libellé de l'étape est mis à jour à mesure que l'agent exécute des actions plus spécifiques pour résoudre votre question.
Une fois que l'agent a trouvé une réponse définitive, celle-ci s'affiche sous les étapes d'investigation, avec des suggestions d'invites de suivi.
Cliquez sur l'une des requêtes suggérées pour continuer la conversation. Cliquez sur
.d'une étape d'investigation pour mieux comprendre ce que l'assistance par IA a fait en coulisses.
Lorsque vous développez un chip de progression, le code exécuté par l'agent s'affiche, ainsi que sa valeur de retour. Copiez le code exécuté pour une utilisation ultérieure, par exemple en l'exécutant avec le panneau de console.
Conversations suspendues
L'aide de l'IA peut générer du code avec des effets secondaires. Dans ce cas, la conversation est mise en pause avant l'exécution du code.
Lorsque la conversation est suspendue, examinez le code proposé par l'agent. Cliquez sur
Continuer pour continuer ou sur Annuler pour empêcher l'exécution.Aucune réponse donnée
L'assistance par IA peut ne pas fournir de réponse pour diverses raisons.
Si vous pensez que votre requête est un sujet que l'assistance par IA devrait pouvoir aborder, signalez un bug.
Historique de la conversation
Une fois que vous avez commencé une conversation, chaque réponse suivante est basée sur vos interactions précédentes avec l'IA.
Utilisez les commandes en haut à gauche du panneau pour contrôler l'historique de vos conversations.
Mesurer une distance
Pour démarrer une nouvelle conversation avec le contexte de conversation actuellement sélectionné, cliquez sur le bouton .
Continuer
Pour poursuivre une conversation passée, cliquez sur le bouton
, puis sélectionnez la conversation dans le menu contextuel.Supprimer
Pour supprimer une conversation de l'historique, cliquez sur le bouton
.Noter les réponses et envoyer des commentaires
L'assistance IA est une fonctionnalité expérimentale. Nous attendons donc vos commentaires pour savoir comment améliorer la qualité des réponses et l'expérience globale.
Réponses aux votes
Évaluez une réponse à l'aide des boutons
J'aime et Je n'aime pas situés sous la réponse.Signaler des réponses
Pour signaler un contenu inapproprié, cliquez sur le bouton
à côté des boutons de vote.