Close

Estilos em HTML

Estilos em HTML

 

Com a HTML 4.0 toda a formatação pode ser transferida do documento HTML para uma folha de estilo separada.

Como Usar Estilos

Quando um navegador lê uma folha de estilo, ele formata o documento de acordo com ela. Há três maneiras de inserir uma folha de estilo:

Folha de Estilo Externa

Uma folha de estilo externa é ideal quando o estilo é aplicado em muitas páginas. Com uma folha de estilo externa, você pode mudar a aparência de um sítio Web inteiro pela mudança de um arquivo. Cada página deve vincular-se à folha de estilo usando a tag <link>. A tag <link> vai dentro da seção head.




<head>
<link rel="stylesheet" type="text/css"
href="meuestilo.css">
</head>

Folha de Estilo Interna

Uma folha de estilo interna deve ser usada quando um documento específico tem um estilo único. Você define estilos internos na seção head com a tag <style>.

<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>

Estilos Local (inline)

Um estilo local (inline) deve ser usado quando um estilo único deve ser aplicado a uma única ocorrência de um elemento.

Para usar estilos locais (inline) você usa o atributo de estilo na tag relevante. O atributo de estilo pode conter qualquer propriedade CSS. O exemplo mostra como mudar a cor e a margem esquerda de um parágrafo:

<p style="color: red; margin-left: 20px">
Este é um parágrafo
</p>

Para aprender mais sobre estilos, visite o tutorial de CSS (em inglês).



Tags de Estilo

TagDescrição
<style>Define uma definição de estilo
<link>Define uma referência a um recurso
<div>Define uma seção num documento
<span>Define uma seção num documento
<font>Depsaprovada. Use estilos em vez
<basefont>Desaprovada. Use estilos em vez
<center>Desaprovada. Use estilos em vez

Related Posts