1. Seletor de tipo O que é um seletor de tipo? Refere-se ao caractere de linha que leva o tipo de tag existente na página da web como nome. Body é um tipo de tag em uma página da web, incluindo div, p e span.
Como segue:
corpo {}
div{}
p{}
período {}
2. Seletor de grupo
Para objetos XHMTL, o mesmo estilo pode ser atribuído a um grupo ao mesmo tempo.
Os seletores são separados por vírgulas. A vantagem de escrever desta forma é que o mesmo estilo só precisa ser escrito uma vez, o que reduz a quantidade de código e melhora a estrutura do código CSS.
Ao usá-lo, observe que "vírgula" está no modo de meia largura, não no modo de largura total chinês.
Como segue:
h1,h2,h6,p,span
{
tamanho da fonte: 12px;
cor:#FF0000;
família de fontes: arial;
}
3. Contém seletores para especificar estilos para subobjetos em um objeto, para que o método de seleção desempenhe uma função.
Deve-se observar que esta configuração de estilo só é válida para rótulos de subobjetos deste objeto. Esta configuração de estilo não se aplica a outros subobjetos que existam sozinhos ou estejam localizados fora deste objeto.
A vantagem disso é que nos ajuda a evitar configurações excessivas de id e classe e a definir diretamente os elementos necessários.
Como segue:
intervalo h2
{
cor:vermelho;
}
do seguinte modo:
corpo h1 span forte
{
peso da fonte: negrito;
}
4. O seletor de id é
um seletor que aparece com base no princípio do modelo de objeto de documento DOM. Para um arquivo XHTML, cada tag pode receber um nome na forma de um id="", mas deve-se observar que em. um arquivo XHTML O ID é exclusivo e não pode ser repetido.
Em uma página da web com layout CSS div, você pode nomeá-la para diferentes finalidades, como cabeçalho para o cabeçalho e rodapé para a parte inferior.
O XHTML é o seguinte:
#content
{
tamanho da fonte: 14px;
altura da linha: 120%;
}
5. Seletor de classe
Na verdade, id é uma extensão de tags XHTML e classe é uma combinação de múltiplas tags SHTML. A tradução literal de classe significa classe ou categoria.
Para tags XHTML use class="" para atribuição de nome. Ao contrário dos ids, as classes podem ser reutilizadas. Vários elementos com o mesmo estilo podem ser definidos diretamente como uma classe.
As vantagens de usar classe são evidentes. Ela reflete a capacidade de reutilização do código CSS. Muitas tags podem ser definidas usando um estilo sem escrever um código de estilo para cada uma.
O XHTML é o seguinte:
.he
{
margem:10px;
cor de fundo:vermelho;
}
6. Seletores específicos de tags
Se quiser usar id e classe ao mesmo tempo, e também quiser usar seletores de tags ao mesmo tempo, você pode usar o seguinte método:
h1#content {}
/*Representa todas as tags h1 com id como conteúdo*/
h1.p1 {}
/*Indica todas as tags h1 com classe p1*/
A precisão do seletor específico do rótulo está entre o seletor de rótulo e o seletor de id/classe, e é um dos seletores comumente usados.
7. Seletores de combinação
Para todos os seletores acima, use-os em combinação. Como segue:
h1 .p1 {}
/*Indica todas as tags com classe p1 em h1*/
#content h1 {}
Representa todas as tags h1 sob a tag com conteúdo de ID
h1 .p1,#content h1 {}
/*Representa todas as tags h1 sob h1 com classe p1 e todas as tags h1 sob a tag com id content*/
h1#conteúdo h2{}
/*tag h2 sob a tag h1 com id como conteúdo*/
Os seletores CSS são muito gratuitos e flexíveis. Você pode usar vários seletores de acordo com as necessidades da página para estruturar e otimizar o arquivo CSS tanto quanto possível.