H1 tag class (alternate)
Eu sei que o H1 tag é importante para o SEO, por isso todo o meu título é H1 (bravo!)
Agora, eu preciso ter um título (como a primeira linha de um texto ) um pouco diferente em algumas páginas.normalmente, duplico o h1 como h2 e alterno.
a questão: é possível adicionar uma classe à etiqueta do título... (Eu tentei sem sucesso)
7 answers
Claro que podes.
<h1 class="someclass">…</h1>
A class o atributo é a no grupo de atributos coreattrs dos atributos principais que podem ser usados com o h1 Elemento
Você pode estilar um cabeçalho como este:
h1 { color: red; }
Ou assim:
<h1 class="fancy">Fancy</h1>
.fancy { font-family: fantasy; }
Se não estiver a funcionar:
- verifique se não tem uma 'stylesheet' antiga em 'cache' (ctrl-F5 para recarregar)
- verifique se não tem quaisquer regras que ultrapassem a sua classe (A inspecção com Firebug ou semelhante é muito útil aqui).
- verifique se existem erros de digitação no HTML e no CSS
Editar:
Parece que tiveste ... em vez de ... distinção:h1 .myClass { } /* any element with class="myClass" within an <h1> */
h1.myClass { } /* any <h1> with class="myClass" */
Parece que estás a usar h1 para todos os títulos da página. Tipicamente, você teria uma única marca h1 na página para o que a página contém (com o texto pelo menos parcialmente correspondente ao título da página), e marcas de cabeçalho menores para manchetes de diferentes partes do conteúdo. Dessa forma você dá a maioria das informações aos motores de busca sobre o que é importante na página. Há, claro, páginas que não se encaixam neste modelo, mas muitas se encaixam.
Para todas as marcas h1:
h1 { font-weight: bold; }
Para todas as marcas h1 e h2:
h1, h2 { margin: 10px; }
Para todas as etiquetas h1 dentro de um elemento com id="main":
#main h1 { background: #ccc; }
Para todas as marcas comclass="Info":
h2.Info { color: #000; }
Para todas as etiquetas h3 dentro de um elemento com class="More":
.More h3 { text-decoration: underline; }
Você Pode adicionar uma classe a uma etiqueta <h1>. Assim:
<h1 class="myclass"> ... </h1>
Você pode facilmente estilá-lo assim:
<style type="text/css">
.myclass { color : green }
</style>
A etiqueta está na sua secção , por isso não faria sentido adicionar uma classe a ela.
Pode adicionar uma classe à sua etiqueta .
<h1 class="title">
O seguinte deve funcionar:
<html>
<head>
<style type="text/css">
h1.custom {
color: red;
font-size: 16px;
}
</style>
</head>
<body>
<h1 class="custom"> test </h1>
</body>
</html>
<div class='row' id='content-wrapper'>
<div class='clear'/>
<b:if cond='data:blog.pageType == "error_page"'>
<div id='error-wrap'>
<h1 class='error-item'>404</h1>
<h2>Page Not Found!</h2>
<p>Sorry, the page you were looking for in this blog does not exist.</p>
<div class='clear'/>
<a class='homepage' expr:href='data:blog.homepageUrl'><i class='fa fa-home'/> Go To Home</a>
</div>