Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Raphael1

Tags HTML e CSS (Básico)

Recommended Posts

Bom dia galera estou inciando no ramo de programação web e gostaria de tirar uma dúvida

 

Nesse código é possível fazer a formatação de <h1> através da tag Style de CSS, porém todos os h1 criado no <body> terão formatação igual. Existe alguma possibilidade de se criar, dessa mesma forma(com tag de CSS), diferentes formatações para diferentes h1? 

<style> // ;

h1{ font-family: Arial;

font-size: 30pt;

color: blue; 

text-shadow: 2px 2px 2px black;

 }

</style>

<body>

<h1>Olá, mundo!!</h1>

<h2>Vou chegar lá!!</h2>

<h1>OBAA!!</h1>

</body>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Se quer fazer formatações diferentes, o ideal é utilizar classes para cada h1. Até para reaproveitar o código.

 

<style>
.primeiro-h1 { 
	font-family: Arial;
	font-size: 30pt;
	color: blue; 
	text-shadow: 2px 2px 2px black;
}
.segundo-h1 {
  	font-family: Arial;
  	font-size: 50pt;
  	color: red; 
  	text-shadow: 5px 5px 5px black;
}
</style>

<body>
  <h1 class="primeiro-h1">Olá, mundo!!</h1>
  <h2>Vou chegar lá!!</h2>
  <h1 class="segundo-h1">OBAA!!</h1>
</body>

Só lembrando que se sua aplicação for um site, não é legal ter mais de um h1 por página.

Compartilhar este post


Link para o post
Compartilhar em outros sites

@lciceris deu uma boa solução. Uma outra prática visando a crianção de menos classes é você trabalhar com seletores encadeados, dessa forma você consegue aplicar estilos de foma "modularizada". Veja um exemplo: https://jsfiddle.net/dougtop/bc2rdyr9/

 

Se quiser saber mais sobre eles, aqui fala sobre: https://tableless.com.br/seletores-agrupados-e-encadeados/

 

Abraços!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.