Índice:
- 1Se você estiver definindo um novo estilo que deseja aplique para um elemento existente, clique para colocar seu cursor sobre o elemento que deseja formatar com o novo estilo.
- 2 No painel Seletores do painel CSS Designer, selecione o nome da folha de estilo para a qual deseja adicionar o novo estilo.
- 3 No painel Seletores, clique no sinal de mais (+).
- 4 Clique duas vezes no nome do seletor e edite-o ou substitua-o pelo nome que deseja usar para o seu estilo.
- 5 No painel Propriedades, especifique as configurações em sua regra de estilo.
Vídeo: Curso CSS ( Aula 02 ) -- Os Seletores ID e CLASS [Entendendo o ID e a CLASS] 2024
Os seletores de classe e ID no Dreamweaver têm muitas semelhanças e uma diferença chave. Os estilos de identificação só podem ser usados uma vez por página, mas os estilos de classe podem ser usados tantas vezes na mesma página que você quiser.
Os estilos de classe e identificação têm as seguintes semelhanças:
Você pode nomear os estilos criados com os seletores de classe e ID do que quiser. Você não deve incluir espaços ou caracteres especiais em nomes de estilos, embora o sublinhado e o hífen estejam bem. O uso de todas as minúsculas é uma prática comum, mas não requerida.
Você pode aplicar estilos de classe e ID a qualquer elemento em uma página, mas eles são mais comumente aplicados às tags de cabeçalho, tags div, tags de lista não ordenados, tags de parágrafo, tags de imagem e o novo HTML5 Tag.
O uso de estilos criados com a classe eo seletor ID é um processo de duas etapas. Primeiro, você cria um novo estilo usando a classe ou o seletor ID e dá-lhe um nome; então você aplica o estilo a um elemento na página.
Para definir uma nova classe ou estilo de identificação, crie e salve um novo documento ou abra um arquivo existente e siga estas etapas:
1Se você estiver definindo um novo estilo que deseja aplique para um elemento existente, clique para colocar seu cursor sobre o elemento que deseja formatar com o novo estilo.
Embora esta etapa não seja necessária (você pode criar estilos para elementos que ainda não estão na página), o Dreamweaver cria automaticamente nomes de seletores com base no elemento de página que o seu cursor está selecionando atualmente.
2 No painel Seletores do painel CSS Designer, selecione o nome da folha de estilo para a qual deseja adicionar o novo estilo.
Se você deseja segmentar o estilo para um tipo de mídia específico ou tamanho de tela, defina uma consulta de mídia no painel @Media.
Se você não especificar uma consulta de mídia, o Dreamweaver usará a propriedade Global e seu estilo funcionará em todos os formatos de mídia e tamanhos de tela.
3 No painel Seletores, clique no sinal de mais (+).
Um novo seletor é adicionado ao painel Seletores. O Dreamweaver adicionou um nome de seletor composto, que inclui todos os estilos já aplicados ao título onde seu cursor estava descansando quando você começou a definir o estilo.
4 Clique duas vezes no nome do seletor e edite-o ou substitua-o pelo nome que deseja usar para o seu estilo.
Você pode nomear estilos de classe e ID o que quiser, desde que não use espaços ou caracteres especiais que não o hífen (-) ou o sublinhado (_).
Se você quiser criar um estilo usando o seletor de classe, você deve começar o nome do estilo com um ponto ou período.Se você quiser usar o seletor ID, o nome do estilo deve começar com um sinal de libra (#).
5 No painel Propriedades, especifique as configurações em sua regra de estilo.
Os seletores de classe e ID são fáceis de aplicar ao conteúdo depois de criá-los porque o Dreamweaver adiciona esses estilos às listas suspensas Classe e ID no Inspetor de propriedades, localizado na parte inferior do espaço de trabalho.
