Folhas de estilo podem ser classificadas em três tipos:
Externas (Importadas ou linkadas)
Incorporadas
Inline
Linkando uma folha externa:
.<head>
.<link rel="stylesheet" type="text/css" href="estilo.css">
.</head>
Importando uma folha externa:
.<head>
.<style type="text/css">
.@import url("estilo.css");
.</style>
.</head>
Incorporadas
Uma folha de estilo é dita incorporada ou interna, quando as regras CSS são declaradas na seção head do próprio documento HTML.
.<head>
.<style rel="stylesheet" type="text/css">
.<;!--
.body { background: #000; url(imagens/minhaimagem.gif); }
.h3. { color: #f00; }
.p { margin-left: 15px; padding:1.5em; }
.-->
.</style>
.</head>
Nota: Navegadores ignoram elementos desconhecidos. Isto significa que um navegador antigo que não suporte estilos, ignorará o elemento style, mas o conteúdo do elemento (as regras de estilo) será mostrado na tela. Para evitar que um navegador antigo mostre o conteúdo do elemento style coloque sinais de comentário HTML em volta das regras de estilo.
Folha de estilo em escopo
A HTML5 criou uma folha de estilo do tipo vinculada para ser usada dentro de um container da marcação HTML. As regras CSS declaradas nessa modalidade de folha de estilo se aplicam somente ao elementos da marcação que se encontram dentro do container, ou no escopo do container, daí seu nome.
.<!-- marcação HTML do documento -->
.<div class="minha-classe">
.<style rel="stylesheet" type="text/css" scoped="scoped">
./* regras de estilo */
.</style>
.<!-- marcação HTML dentro do div.minha-classe As regras CSS serão aplicadas somente aqui -->
.</div>
.<!-- mais marcação HTML do documento -->