Classes HTML

A classe é um atributo do elemento HTML usado para classificar elementos semelhantes para estilo. A classe pode conter vários CSS e propriedades relacionadas a JavaScript a serem usadas para vários elementos HTML. O uso primário dos atributos de classe é adicionar as propriedades da classe da planilha de estilo a um elemento HTML. No entanto, o JavaScript também pode ser chamado usando o atributo de classe. Este artigo fornece os seguintes resultados de aprendizado:

- criar uma classe

- Como usar uma aula em html

Como criar uma classe HTML

Uma classe HTML pode ser criada usando o atributo de classe nos elementos HTML. As classes são definidas para criar vários grupos que podem ser usados ​​com as mesmas propriedades de estilo. A sintaxe a seguir pode ser usada para fazer uma classe HTML dentro do elemento HTML:

O nome da classe é sensível ao caso e, portanto, ser usado com cuidado. Além disso, se você deseja definir várias classes para um único elemento, deve adicionar o espaço entre os nomes das classes.

Exemplo 1: classe única em um elemento HTML

O seguinte código HTML define um atributo de classe no

Tag de HTML.

Bem-vindo

Uma classe chamada "primária" é definida no

marcação. A imagem do código é fornecida abaixo:

Exemplo 2: várias classes em um único elemento HTML

O código fornecido abaixo associa um único elemento HTML a várias classes.

Observação: Ao lidar com várias classes em um elemento HTML, os nomes das classes devem ser separados por um espaço, caso contrário, seria considerado uma única classe. Além disso, os nomes da classe são definidos pelo usuário para que você possa escolher qualquer um deles ou criar seus próprios.

Bem-vindo

o vale da tecnologia

O código acima mostra que o

A tag está associada à classe "primária", enquanto a

tag tem duas classes "secundárias" e "terciárias"

A imagem do código está anexada aqui:

Como vincular uma classe HTML ao CSS

Um dos principais propósitos das classes HTML é estilizar os elementos de maneira coletiva. Por exemplo, associamos alguns elementos HTML ao mesmo nome de classe e definimos propriedades de estilo contra esse nome de classe. Esses estilos seriam distribuídos onde quer que esse nome de classe específico seja definido. As etapas a seguir podem ser seguidas para usar a classe HTML para fabricar estilos:

- Inicie uma tag

- Use a seguinte sintaxe para vincular a classe ao seu CSS

O nome da classe refere -se à classe que você definiu no código HTML e é iniciado com o DOT, como mostrado na sintaxe acima e depois disso, as propriedades de estilo são definidas no aparelho encaracolado.

Exemplo 3: Usando uma única classe HTML no CSS

Vamos ilustrar a ligação de uma única classe HTML com CSS. O código escrito abaixo faz uso de classe única com HTML e CSS:

Bem -vindo ao Linuxhint

- A classe HTML é nomeada como "nota" no

marcação

- Ao chamá -lo na tag, escreva “.Observe ”e depois definiu as propriedades de estilo dentro dos aparelhos encaracolados, como pode ser visto no código acima. A imagem a seguir fornece o código escrito no editor:

A saída da página da web do código HTML acima é fornecida abaixo:

Exemplo 4: Usando várias classes HTML no CSS

Conforme discutido na parte anterior do guia, as várias classes também podem ser usadas em um único elemento HTML. O código fornecido abaixo pratica duas classes no CSS e depois as usa em um único elemento HTML.

Bem -vindo ao Linuxhint! um provedor de conteúdo líder

O código HTML está descrito abaixo:

- As três classes HTML são usadas denominadas como "BOD", "Col" e "Fon"

- A classe "BOD" é definida em tag, enquanto o "Col" e "Fon" são definidos no

marcação

Como duas classes são usadas no

tag, assim eles seriam separados por um espaço para que

obtém as propriedades de ambas as classes.

A imagem a seguir mostra o código:

A saída do código na página da web é mostrada abaixo:

Conclusão

O atributo de classe HTML é usado para categorizar o elemento HTML. Com a ajuda das classes HTML, os elementos HTML podem ser estilizados de maneira coletiva. Este artigo fornece um guia descritivo sobre classes HTML e como elas estão associadas ao CSS. Ilustramos vários exemplos que apresentam a criação de classes HTML e vinculando -os com CSS. Conclui -se que a integração das classes HTML com CSS é o principal benefício das classes HTML.