Assistência de IA para a estilização

Matthias Rohmer
Matthias Rohmer

Use o painel Assistência de IA para entender o layout geral de um site, estilos de elementos específicos e para receber correções geradas por IA para bugs do CSS.

Abrir o painel "Assistência por IA"

O painel Assistência de IA é aberto na gaveta.

O painel de assistência de IA foi aberto no estado padrão.

No painel "Elementos"

Para abrir a assistência de IA no painel "Elements", ao inspecionar um nó DOM, clique com o botão direito do mouse no nó e selecione a opção Ask AI.

O menu de contexto do elemento com a opção "Ask AI" destacada.

Quando você abre a Assistência por IA dessa forma, o elemento DOM inspecionado já está pré-selecionado como um elemento de contexto para a conversa.

Como alternativa, clique no botão flutuante anexado a um nó do DOM com o cursor.

O botão flutuante anexado a um nó do DOM.

No menu de comando

Para abrir a Assistência de IA no menu de comando, digite AI e execute o comando Mostrar assistência de IA, que tem o selo Drawer ao lado.

O menu de comando aberto com a opção "Mostrar assistência de IA" destacada.

No menu "Mais ferramentas"

Como alternativa, no canto superior direito, selecione Mais opções > Mais ferramentas > Assistência por IA.

Menu "Mais ferramentas" aberto.

Contexto da conversa

As conversas com assistência de IA sempre se relacionam ao elemento inspecionado, que é o último elemento selecionado na árvore DOM do painel Elements. Uma referência a esse elemento é mostrada no canto inferior esquerdo do painel.

O painel de assistência de IA com o elemento de contexto destacado.

Mude o contexto usando o botão de seleção de elementos ao lado do elemento atual ou selecionando na árvore DOM do painel de elementos.

Embora o elemento inspecionado atualmente seja a base da conversa, a assistência de IA tem acesso a todas as APIs da Web para coletar mais informações da página inspecionada. Isso inclui consultar outros elementos com document.querySelector ou avaliar estilos computados.

Solicitações de prompt

Ao iniciar uma nova conversa, a assistência de IA para estilização oferece exemplos de comandos para ajudar você a começar rapidamente.

O painel de assistência de IA com os exemplos de comandos em destaque.

Clique em qualquer uma das solicitações para preencher o campo de entrada de comando na parte de baixo do painel.

Como alternativa, digite seu próprio comando ou pergunta no campo de entrada.

Para enviar uma solicitação, pressione Enter ou clique na seta à direita do campo de entrada.

Fluxo de conversa

O envio de uma solicitação inicia a conversa com o agente de estilo. Para receber as informações necessárias para responder melhor à solicitação, o agente gera e executa JavaScript que chama APIs da Web. O progresso do agente é mostrado em etapas. O status da etapa inicial é Investigating….

Painel de assistência de IA após o início de uma conversa.

O rótulo da etapa é atualizado à medida que o agente executa ações mais específicas para resolver sua pergunta.

Quando o agente chega a uma resposta final, ela aparece abaixo das etapas de investigação, incluindo sugestões para solicitações de acompanhamento.

Painel de assistência de IA com uma resposta dada pela IA.

Clique em qualquer uma das sugestões para continuar a conversa. Clique em .

de uma etapa de investigação para entender melhor o que a assistência por IA fez nos bastidores.

Painel de assistência por IA com uma etapa de conversa aberta.

Quando você expande um ícone de progresso, o código executado pelo agente é mostrado, junto com o valor de retorno. Copie o código executado para uso futuro, como executá-lo com o painel do console.

Conversas pausadas

A assistência de IA pode gerar código com efeitos colaterais. Quando isso acontece, a conversa é pausada antes que o código seja executado.

Painel de assistência por IA com uma conversa pausada.

Quando a conversa pausar, revise o código proposto pelo agente. Clique em Continuar para prosseguir ou em Cancelar para impedir a execução.

Nenhuma resposta

A assistência por IA pode não fornecer respostas por vários motivos.

Painel de assistência por IA com uma conversa recusada.

Se você acha que o comando é algo que a assistência por IA pode discutir, envie um bug.

Histórico da conversa

Depois que você inicia uma conversa, cada resposta é baseada nas interações anteriores entre você e a IA.

Use os controles no canto superior esquerdo do painel para controlar o histórico de conversas.

Painel de assistência de IA com os controles de histórico destacados.

Iniciar nova

Para iniciar uma nova conversa com o contexto de conversa selecionado, clique no botão .

Continuar

Para continuar uma conversa anterior, clique no botão e selecione-o no menu de contexto.

Excluir

Para excluir uma conversa do histórico, clique no botão .

Avaliar respostas e enviar feedback

A assistência de IA é um recurso experimental. Por isso, estamos sempre em busca do seu feedback para saber como podemos melhorar a qualidade das respostas e a experiência geral.

Painel de assistência de IA com controles de classificação em destaque.

Votar nas respostas

Avalie uma resposta usando os botões Gostei e Não gostei abaixo da resposta.

Denunciar respostas

Para denunciar conteúdo inadequado, clique no botão ao lado dos botões de votação.