Como segmentar uma classe CSS dentro de outra classe CSS

Como segmentar uma classe CSS dentro de outra classe CSS
As classes desempenham um papel crucial ao discutir a especificação de qualquer elemento no CSS ou em qualquer outra linguagem de programação. Para expressar alguns estilos e efeitos nos componentes HTML, as classes são geradas no CSS. Ao dar os valores da propriedade, todas as propriedades do CSS podem ser adicionadas ao corpo da classe.

Esta posta.

Como segmentar a classe CSS dentro de outra classe CSS?

Para atingir uma classe CSS dentro de outra classe CSS, primeiro, faça contêineres da Div e adicione atributos de classe em cada contêiner. Em seguida, acesse uma ou mais classes no CSS, utilizando seu nome/valor.

Etapa 1: adicione um contêiner "div"

Inicialmente, adicione um elemento div com a ajuda de “”. Em seguida, aloque um atributo de classe para uso posterior.

Etapa 2: Faça recipientes de “div” aninhados

Em seguida, faça os contêineres de Div aninhados seguindo o mesmo procedimento da Etapa 1:




Casar
Jack
Tom
Jully


Saída

Etapa 3: aplique o estilo no contêiner principal “div”

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

.conteúdo principal
largura: 40%;
margem: 0 automático;
cor azul;
borda: 2px azul pontilhado;
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 para o texto adicionado no elemento.
  • ““fronteira”Define um esboço ou limite ao redor do elemento em HTML.
  • ““Alinhamento de texto”Define o alinhamento do texto do elemento.

Etapa 4: estilo outra classe

Acesse a classe principal do 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 snippet de código abaixo:

.conteúdo principal .C-Right
Exibição: bloco embutido;
Size da fonte: 20px;

De acordo com o snippet de código acima:

  • ““mostrar”A propriedade é 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 .C-Left
Largura: 140px;
Margem-direita: 6px;
Size da fonte: 16px;

Para fazer isso, vamos nos inscrever “largura","Margem-direita" e "tamanho da fonte”Para fins de estilo.

Além disso, acesse o principal “div”Contêiner ao longo de outro contêiner de divindor

.principal .C-Right
Largura: Auto;
Size da fonte: 15px;
Cor: #FFF;
Margem-direita: 20px;
peso-fonte: normal;

Saída

Isso se trata de segmentar uma classe CSS dentro de outra classe CSS.

Conclusão

Para atingir uma classe CSS dentro de outra classe CSS, primeiro, acesse o principal “div”Através do atributo de classe atribuído. Em seguida, acesse outro contêiner "div" seguindo o mesmo procedimento. Além disso, os usuários podem segmentar uma classe CSS em outra classe CSS. Este post demonstrou o método para direcionar uma classe CSS dentro de outra classe CSS.