Assistenza basata sull'IA per la definizione degli stili

Matthias Rohmer
Matthias Rohmer

Utilizza il riquadro Assistenza AI per gli stili per comprendere il layout complessivo di un sito web, gli stili di elementi specifici e per ottenere correzioni generate dall'IA per i bug CSS.

Apri il riquadro "Assistenza AI"

Il riquadro Assistenza IA si apre nel riquadro a scomparsa.

Il riquadro di assistenza AI si è aperto nel suo stato predefinito.

Dal riquadro Elementi

Per aprire l'assistenza AI dal riquadro Elementi, quando esamini un nodo DOM, fai clic con il tasto destro del mouse sul nodo e seleziona l'opzione Chiedi all'AI.

Il menu contestuale dell'elemento con "Chiedi all'IA" evidenziato.

Quando apri l'assistenza AI in questo modo, l'elemento DOM ispezionato è già preselezionato come elemento di contesto per la conversazione.

In alternativa, fai clic sul pulsante mobile associato a un nodo DOM visualizzato.

Il pulsante mobile collegato a un nodo DOM.

Dal menu di comando

Per aprire l'assistenza AI dal menu dei comandi, digita AI ed esegui il comando Mostra assistenza AI, accanto al quale è presente il badge Riquadro.

Il menu di comando aperto con "Mostra assistenza dell'IA" evidenziato.

Dal menu "Altri strumenti"

In alternativa, nell'angolo in alto a destra, seleziona Altre opzioni > Altri strumenti > Assistenza AI.

Il menu Altri strumenti aperto.

Contesto della conversazione

Le chat con l'assistenza AI si riferiscono sempre all'elemento attualmente ispezionato, ovvero l'ultimo elemento selezionato nella struttura ad albero DOM del riquadro Elementi. Un riferimento a questo elemento viene mostrato nell'angolo in basso a sinistra del riquadro.

Il riquadro di assistenza AI con l'elemento di contesto evidenziato.

Modifica il contesto utilizzando il pulsante di selezione degli elementi accanto all'elemento corrente o selezionando un elemento dalla struttura DOM del riquadro Elementi.

Sebbene l'elemento attualmente ispezionato sia la base della conversazione, l'assistenza AI ha accesso a tutte le API web per raccogliere maggiori informazioni dalla pagina ispezionata. Sono incluse le query su altri elementi con document.querySelector o la valutazione degli stili calcolati.

Prompt

Quando avvii una nuova conversazione, l'assistenza IA per lo stile offre prompt di esempio per aiutarti a iniziare rapidamente.

Il riquadro di assistenza IA con i prompt di esempio evidenziati.

Fai clic su uno dei prompt per precompilare il campo di immissione del prompt nella parte inferiore del riquadro.

In alternativa, digita il tuo prompt o la tua domanda nel campo di immissione.

Per inviare un prompt, premi Enter o fai clic sulla freccia sul lato destro del campo di immissione.

Flusso di conversazione

L'invio di un prompt avvia la conversazione con l'agente di stile. Per ottenere le informazioni necessarie per rispondere al meglio al tuo prompt, l'agente genera ed esegue JavaScript che chiama le API web. L'avanzamento dell'agente viene mostrato in passaggi. Lo stato del passaggio iniziale è Investigating….

Il riquadro di assistenza IA dopo l'inizio di una conversazione.

L'etichetta del passaggio si aggiorna man mano che l'agente esegue azioni più specifiche per risolvere la tua domanda.

Una volta che l'agente ha trovato una risposta definitiva, questa viene visualizzata sotto i passaggi dell'indagine, inclusi i suggerimenti per le domande di follow-up.

Il riquadro di assistenza IA con una risposta data dall'IA.

Fai clic su uno dei prompt suggeriti per continuare la conversazione. Fai clic su .

di una fase di indagine per capire meglio cosa ha fatto l'assistenza dell'IA dietro le quinte.

Il riquadro di assistenza IA con un passaggio di conversazione espanso.

Quando espandi un chip di avanzamento, viene visualizzato il codice eseguito dall'agente insieme al relativo valore restituito. Copia il codice eseguito per un uso futuro, ad esempio per eseguire il codice con il riquadro della console.

Conversazioni in pausa

L'assistenza basata sull'IA potrebbe generare codice con effetti collaterali. In questo caso, la conversazione viene messa in pausa prima dell'esecuzione del codice.

Il riquadro di assistenza IA con una conversazione in pausa.

Quando la conversazione viene messa in pausa, esamina il codice proposto dall'agente. Fai clic su Continua per procedere.

Nessuna risposta fornita

L'assistenza AI potrebbe non fornire risposte per vari motivi.

Il riquadro dell'assistenza IA con una conversazione rifiutata.

Se ritieni che il tuo prompt sia qualcosa che l'assistenza AI dovrebbe essere in grado di discutere, segnala un bug.

Cronologia conversazione

Una volta avviata una conversazione, ogni risposta successiva si basa sulle tue interazioni precedenti con l'IA.

Utilizza i controlli nell'angolo in alto a sinistra del riquadro per controllare la cronologia delle conversazioni.

Il riquadro di assistenza IA con i controlli della cronologia evidenziati.

Nuova misurazione

Per avviare una nuova conversazione con il contesto di conversazione attualmente selezionato, fai clic sul pulsante .

Continua

Per continuare una conversazione passata, fai clic sul pulsante e selezionalo dal menu contestuale.

Elimina

Per eliminare una conversazione dalla cronologia, fai clic sul pulsante .

Valuta le risposte e fornisci feedback

L'assistenza IA è una funzionalità sperimentale. Pertanto, stiamo cercando attivamente il tuo feedback per capire come possiamo migliorare la qualità delle risposte e l'esperienza complessiva.

Il riquadro Assistenza IA con i controlli di valutazione evidenziati.

Votare le risposte

Valuta una risposta utilizzando i pulsanti Mi piace e Non mi piace sotto la risposta.

Segnala risposte

Per segnalare contenuti inappropriati, fai clic sul pulsante accanto ai pulsanti di voto.