AI-hulp voor styling

Gebruik het AI-hulppaneel voor styling om inzicht te krijgen in de algehele lay-out van een website, specifieke elementstijlen en om door AI gegenereerde oplossingen voor CSS-bugs te krijgen.

Open het paneel "AI-assistentie".

Het AI-assistentiepaneel gaat open in de lade .

Het AI-assistentiepaneel werd geopend in de standaardstatus.

Vanuit het paneel Elementen

Om AI-assistentie te openen vanuit het Elementenpaneel, klikt u bij het inspecteren van een DOM-knooppunt met de rechtermuisknop op het knooppunt en selecteert u de optie Ask AI .

Het contextmenu van het element met 'Ask AI' gemarkeerd.

Wanneer u AI-assistentie op deze manier opent, is het geïnspecteerde DOM-element al vooraf geselecteerd als contextelement voor het gesprek.

U kunt ook op de zwevende knop klikken die aan een DOM-knooppunt is gekoppeld.

De zwevende knop die is gekoppeld aan een DOM-knooppunt.

Vanuit het opdrachtmenu

Om AI-assistentie te openen vanuit het opdrachtmenu typt u AI en voert u vervolgens de opdracht Toon AI-assistentie uit, met de Lade- badge ernaast.

Het geopende opdrachtmenu met 'Toon AI-assistentie' gemarkeerd.

Vanuit het menu 'Meer hulpmiddelen'

U kunt ook in de rechterbovenhoek Meer opties > Meer hulpmiddelen > AI-assistentie selecteren.

Het geopende menu Meer tools.

Conversatiecontext

Chats met AI-ondersteuning hebben altijd betrekking op het momenteel geïnspecteerde element, wat het laatste element is dat is geselecteerd in de DOM-boom van het Elementenpaneel. Een verwijzing naar dit element wordt weergegeven in de linkerbenedenhoek van het paneel.

Het AI-hulppaneel met het contextelement gemarkeerd.

Wijzig de context met behulp van de elementkiezerknop naast het huidige element of door de DOM-structuur van het Elementenpaneel te selecteren.

Hoewel het momenteel geïnspecteerde element de basis van het gesprek vormt, heeft AI-assistentie toegang tot alle web-API's om meer informatie van de geïnspecteerde pagina te verzamelen. Dit omvat het opvragen van andere elementen met document.querySelector of het evalueren van berekende stijlen.

Vragen

Wanneer u een nieuw gesprek begint, biedt AI-hulp voor styling voorbeeldprompts om u te helpen snel aan de slag te gaan.

Het AI-hulppaneel met de voorbeeldprompts gemarkeerd.

Klik op een van de aanwijzingen om het promptinvoerveld onder aan het paneel vooraf in te vullen.

U kunt ook uw eigen prompt of vraag in het invoerveld typen.

Om een ​​prompt te verzenden, drukt u op Enter of klikt u op de pijl aan de rechterkant van het invoerveld.

Gespreksstroom

Door een prompt te sturen, wordt het gesprek met de stylingagent gestart. Om de informatie te verkrijgen die nodig is om uw vraag zo goed mogelijk te beantwoorden, genereert en voert de agent JavaScript uit dat web-API's aanroept. De voortgang van agenten wordt in stappen weergegeven. De status van de eerste stap is Investigating… .

Het AI-assistentiepaneel nadat een gesprek was begonnen.

Het staplabel wordt bijgewerkt naarmate de agent meer specifieke acties uitvoert om uw vraag op te lossen.

Zodra de agent tot een definitief antwoord komt, wordt het antwoord weergegeven onder de onderzoeksstappen, inclusief suggesties voor vervolgvragen.

Het AI-assistentiepaneel met een antwoord van AI.

Klik op een van de voorgestelde aanwijzingen om het gesprek voort te zetten. Klik op de

van een onderzoeksstap om beter inzicht te krijgen in wat AI-hulp achter de schermen deed.

Het AI-assistentiepaneel met een uitgebreide gespreksstap.

Wanneer u een voortgangschip uitbreidt, ziet u de code die de agent heeft uitgevoerd, samen met de geretourneerde waarde. Kopieer de uitgevoerde code voor verder gebruik, zoals het uitvoeren ervan met het consolepaneel .

Gepauzeerde gesprekken

AI-hulp kan code genereren met bijwerkingen. Wanneer dat gebeurt, wordt het gesprek gepauzeerd voordat de code wordt uitgevoerd.

Het AI-assistentiepaneel met een onderbroken gesprek.

Wanneer het gesprek wordt onderbroken, bekijkt u de door de agent voorgestelde code. Klik op Doorgaan om door te gaan of op Annuleren om uitvoering te voorkomen.

Geen antwoord gegeven

AI-assistentie kan om verschillende redenen mogelijk geen antwoord bieden.

Het AI-assistentiepaneel met een geweigerd gesprek.

Als u denkt dat uw prompt iets is dat AI-hulp zou moeten kunnen bespreken, dien dan een bug in .

Gespreksgeschiedenis

Zodra u een gesprek begint, is elk volgend antwoord gebaseerd op uw eerdere interacties tussen u en de AI.

Gebruik de bedieningselementen in de linkerbovenhoek van het paneel om uw gespreksgeschiedenis te beheren.

Het AI-assistentiepaneel met de geschiedenisknoppen gemarkeerd.

Begin nieuw

Om een ​​nieuw gesprek te starten met de momenteel geselecteerde gesprekscontext , klikt u op de knop .

Doorgaan

Om een ​​eerder gesprek voort te zetten, klikt u op de en selecteert u deze in het contextmenu.

Verwijderen

Om een ​​gesprek uit de geschiedenis te verwijderen, klikt u op de .

Beoordeel de antwoorden en geef feedback

AI-ondersteuning is een experimentele functie. Daarom zijn we actief op zoek naar uw feedback om te leren hoe we de antwoordkwaliteit en de algehele ervaring kunnen verbeteren.

Het AI-hulppaneel met gemarkeerde beoordelingsknoppen.

Stem antwoorden

Beoordeel een antwoord met de knoppen Thumbs up en Thumbs down onder het antwoord.

Rapporteer antwoorden

Om ongepaste inhoud te melden, klikt u op de naast de stemknoppen.