Como aplicar estilos de classe personalizada em folhas de estilo em cascata (css)

estilos de classe, que são também chamados estilos de classe personalizada, estilos personalizados, ou classes personalizadas, em Cascading Style Sheets (CSS) são para aqueles momentos em que você deseja criar um estilo especial e, em seguida, aplicá-lo seletivamente a um número ilimitado de elementos ou de objetos em uma página web.

Por exemplo, na frase “Nossa Daily Deals boletim traz para você os mais quentes de vendas, promoções e ofertas especiais nas lojas mais populares em um fácil de ler e-mail diariamente,” você pode criar um estilo de classe personalizada para modificar o palavras Ofertas diárias e depois aplicar esse estilo para aquelas palavras em HTML.

Ao escrever os estilos de classe no arquivo CSS, certifique-se de incluir um período diretamente antes do nome do selector, conforme mostrado aqui (.):

.Ofertas diárias {Font-family: Georgia, "Times New Roman", Times, serif-font-size: 23px; font-weight: bold-color: # 336699-}

A presença do período executa duas funções:

• Ele ajuda você a identificar rapidamente, num ápice, os estilos de classe de outros tipos de estilos ao rever o seu código CSS.

• Talvez mais importante, ele informa os navegadores que o estilo é uma classe personalizada que será aplicado seletivamente para conteúdo na página.

Quando você cria um estilo de classe, você pode nomear o selector de qualquer coisa que você quiser, contanto que ele não é o nome de uma tag HTML usado atualmente.

Por exemplo, seria uma péssima idéia para criar um estilo classe chamada .corpo ou .p. Assim, de acordo com o conceito de HTML semântico, tentar nomear seus estilos de classe após a função que eles vão se apresentar, como .realçar ou .imageborder.

Quando você terminar de escrever as regras de estilo do CSS para o seu estilo de classe, você pode aplicar o estilo a qualquer objeto no documento HTML, adicionando o classe atribuir à etiqueta de recipiente de abertura do objecto ou o conteúdo a ser denominado:

 class ="Ofertas diárias"gt; as promoções diárias boletim traz-lhe as vendas mais quentes, promoções e ofertas especiais nas lojas mais populares em um fácil de ler e-mail diariamente.

Ao especificar o estilo de classe no código HTML com o classe atributo, o período em que é exigido na CSS ao criar a definição de estilo não precisa ser colocado na frente do nome do estilo entre as aspas, como mostrado no código anterior.

Se preferir que o estilo de classe ser aplicada apenas a uma ou duas palavras ou uma frase curta em vez de todos os elementos dentro de um tag de contêiner, você pode aplicar seletivamente o estilo de classe ao seu objeto (s) usando o tag com o classe atributo:

Nosso "Ofertas diárias"gt;Ofertas diárias boletim traz para você os mais quentes de vendas, promoções e ofertas especiais nas lojas mais populares em um fácil de ler e-mail diariamente.

o tag é uma tag linha usada para aplicar um estilo de elementos dentro do fluxo de texto do documento. Esta tag é essencialmente um tag recipiente HTML vazio que não faz nada até que você diga a ele para fazer algo, aplicando um atributo a ele, como a adição do classe, identidade, ou estilo atribuir ao conteúdo estilo.

A ilustração mostra a diferença entre a adição de um atributo de classe para uma

tag (topo) versus adicionando-à uma etiqueta que rodeia o conteúdo específico (parte inferior).