Aplicar, remover ou renomear estilos de classe CSS

Última atualização em 06/05/2019

Saiba como aplicar, remover ou renomear estilos de classe CSS no Dreamweaver

Nota

O painel CSS Styles foi substituído pelo CSS Designer no Dreamweaver 2017 e em versões posteriores. Para obter mais informações, consulte CSS Designer.

Os estilos de classe são o único tipo de estilo CSS que pode ser aplicado a qualquer texto em um documento, independentemente de quais tags controlam o texto. Todos os estilos de classe associados ao documento atual são exibidos no painel Estilos CSS (com um ponto [.] precedendo o nome) e no menu pop-up Estilo do inspetor de propriedades de texto.

Você verá a maioria dos estilos atualizados imediatamente, no entanto, deve visualizar sua página em um navegador para verificar se um estilo foi aplicado conforme esperado. Quando você aplica dois ou mais estilos ao mesmo texto, os estilos podem entrar em conflito e produzir resultados inesperados.

Nota

Ao visualizar estilos definidos em uma folha de estilo CSS externa, salve a folha de estilos para garantir que suas alterações sejam refletidas quando você visualizar a página em um navegador.

Aplicar um estilo de classe CSS

No documento, selecione o texto ao qual deseja aplicar um estilo CSS.

Posicione o ponto de inserção em um parágrafo para aplicar o estilo a todo o parágrafo.

Se você selecionar um intervalo de texto dentro de um único parágrafo, o estilo CSS afeta apenas o intervalo selecionado.

Para especificar a tag exata à qual o estilo CSS deve ser aplicado, selecione a tag no seletor de tag localizado na parte inferior esquerda da janela Documento.

Para aplicar um estilo de classe, siga um destes procedimentos:
  • No painel Estilos CSS (Janela > Estilos CSS), selecione o modo Todos, clique com o botão direito no nome do estilo que deseja aplicar e selecione Aplicar no menu de contexto.

  • No inspetor de propriedades HTML, selecione o estilo de classe que deseja aplicar no menu pop-up Classe.

  • Na janela Documento, clique com o botão direito (Windows) ou Control+clique (Macintosh) no texto selecionado e, no menu de contexto, selecione Estilos CSS e depois selecione o estilo que deseja aplicar.

  • Selecione Formato > Estilos CSS e, no submenu, selecione o estilo que deseja aplicar.

Remover um estilo de classe em uma seleção

Selecione o objeto ou texto do qual deseja remover o estilo.
No inspetor de propriedades HTML (Janela > Propriedades), selecione Nenhum no menu pop-up de classe.

Renomear um estilo de classe

No painel Estilos CSS, clique com o botão direito no estilo de classe CSS que deseja renomear e selecione Renomear classe.
Nota

Você também pode renomear uma classe selecionando Renomear classe no menu de opções do painel Estilos CSS.

Na caixa de diálogo Renomear classe, verifique se a classe que deseja renomear está selecionada no menu pop-up Renomear classe.
Na caixa de texto Novo nome, digite o novo nome da nova classe e clique em OK.

Se a classe que você está renomeando é interna ao cabeçalho do documento atual, o Dreamweaver altera o nome da classe assim como todas as instâncias do nome da classe no documento atual. Se a classe que você está renomeando está em um arquivo CSS externo, o Dreamweaver abre e altera o nome da classe no arquivo. O Dreamweaver também inicia uma caixa de diálogo Localizar e substituir em todo o local para que você possa procurar todas as instâncias do nome da classe antiga em seu local.