Como direcionar uma classe CSS dentro de outra classe CSS

”. Em seguida, aloque um atributo de classe para uso posterior.

Etapa 2: criar contêineres “div” aninhados

Em seguida, crie contêineres div aninhados seguindo o mesmo procedimento da etapa 1:

< div aula = 'conteúdo principal' >

< div aula = 'mesa' >

< div aula = 'linha' >

< div aula = 'fenda' > Casar < / div >

< div aula = 'c-certo' > Jack < / div >

< div aula = 'fenda' > Tom < / div >

< div aula = 'c-certo' > Julho < / div >

< / div >

< / div >

< / div >

Saída

---

---

Etapa 3: aplicar estilo no contêiner 'div' principal

Acesse o principal “ div ” container com a ajuda do nome da classe como “ .conteúdo principal ”:

.conteúdo principal {

largura : 40% ;

margem : 0 auto ;

cor : azul ;

fronteira : 2px pontilhado azul ;

alinhamento de texto : Centro ;

}

Aqui:

• “ largura ” especifica o tamanho da largura do elemento.
• “ margem ” aloca espaço ao redor do elemento fora da borda definida.
• “ cor ” define a cor do texto adicionado no elemento.
• “ fronteira ” define um contorno ou limite ao redor do elemento em HTML.
• “ Alinhamento de texto ” define o alinhamento do texto do elemento.

Etapa 4: estilizar outra classe

Acesse a classe principal CSS e outras classes aninhadas usando seus nomes. Em seguida, defina a largura do contêiner especificando o valor de acordo com sua escolha:

.conteúdo principal .mesa {

largura : 80% ;

}

Além disso, acesse a outra classe seguindo o mesmo procedimento acima e aplique as propriedades CSS mencionadas no trecho de código abaixo:

.conteúdo principal .c-direita {

mostrar : bloco em linha ;

tamanho da fonte : 20px ;

}

De acordo com o trecho de código acima:

• “ mostrar ” é usada para definir a exibição de um elemento.
• “ tamanho da fonte ” especifica o tamanho do texto adicionado no contêiner.

Agora, acesse as outras classes utilizando o mesmo método e aplique as seguintes propriedades CSS conforme mencionado abaixo:

.conteúdo principal .fenda {

largura : 140px ;

margem direita : 6px ;

tamanho da fonte : 16px ;

}

Para isso, aplicaremos “ largura ”, “ margem direita ' e ' tamanho da fonte ” para fins de estilo.

Além disso, acesse o principal “ div ” ao longo de outro contêiner div aninhado, utilizando seu nome de classe e aplicando as seguintes propriedades CSS

.principal .c-direita {

largura : auto ;

tamanho da fonte : 15px ;

cor : #fff ;

margem direita : 20px ;

espessura da fonte : normal ;

}

Saída

Isso é tudo sobre direcionar uma classe CSS dentro de outra classe CSS.

Conclusão

Para direcionar uma classe CSS dentro de outra classe CSS, primeiro acesse o menu principal “ div ” por meio do atributo de classe atribuído. Em seguida, acesse outro container “div” seguindo o mesmo procedimento. Além disso, os usuários podem direcionar uma classe CSS dentro de outra classe CSS. Esta postagem demonstrou o método para direcionar uma classe CSS dentro de outra classe CSS.