Home
ìndice Html
ìndice CSS

Folhas de Estilo
Como usar uma folha de estilo externa.

As folhas de estilo podem ser escritas de três formas diferentes.

Elas podem ser aplicadas direto na tag html.

<p style= "color: #FF9900;"> Parágrafo com Identificador<p class= "destaque detalhe"> estilo in line, direto no elemento. Esta forma dificulta e tira do css um dos maiores poderes que ele tem. Que é o controle centralizado da apresentação.

Existe também as formas incorporadas, no próprio documento como foi feito aqui.

No cabeçalho. Entre head e head, veja o exemplo:
 <head>
     <style type= "text/css">
         h1, p {
               color: #0000FF;
               background-color: #3366FF;
               }
             p {
               color: #C8C8C8;
               }
            h1 {
              fonte-family: Comics Sans MS;
               }

             h2 {
               color: #FF00FF;
                }	
        </style>
 </head>

Obs: A vantagem desta forma é que dá para localizar com mais facilidade as folhas de estilo. Em um documento html extenso, com muitas linhas, quando o estilo é aplicado direto na tag, fica difícil achar o css para modificá-lo. Existe desvantagem também, ao se aplicar este estilo dentro de um documento. Em um site com centenas de páginas, precisaríamos fazer essas alterações em cada uma das páginas. Nesse caso usaríamos a terceira forma.

Pode-se criar um documento à parte

Usando uma folha de estilo externa. A forma correta de colocar é a descrita a seguir:

          
<head>
    <meta charset="UTF-8"/ >
    <meta name="description" content="Folha de Estilo Css"/ >
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

    <title>Regras CSS</title>   
    <link rel="stylesheet" type="text/css" href="/static/css/
    style-folha-estilo.css"/> aqui pode-se escolher a forma que quiser
</head>

O atributo type é obrigatório, para validar o documento, nos validadores da w3c. Validador