Esta página demonstra a utilização das 3 formas de inserir CSS em uma página:
link, podemos ligar um arquivo CSS externo com a nossa página. Este é o método mais recomendado,
pois como podemos ligar uma folha de estilos a diversos arquivos, a manutenção do site fica muito mais fácil (apenas um arquivo CSS pode ser usado para um site inteiro).
style, você poderá aplicar estilos que valem para a página onde o elemento está inserido.
Os estilos em uma tag style tem precedência sobre os estilos em um arquivo externo (isto faz parte da cascata do CSS, o que veremos ao longo do tempo).
Todos os elementos style devem ficar dentro do elemento head de uma página.
style em elementos como parágrafos, itens de lista, e muitos outros.
Este método é chamado de "inline styles" (ou estilos em linha) por serem localizados junto com o código HTML. Este tipo de CSS tem precedência sobre os outros.
Porém, seu uso não é recomendado, pois mistura o código CSS com o HTML (lembre da separação em 3 camadas) e dificulta a manutenção do site. Portanto, o seu uso deve ser feito
com cuidado e geralmente não é necessário.
Perceba também a utilização da tag ol (ordered list, ou lista ordenada) para enumerar a lista acima. Semelhante a ul, também utilizamos li para os itens da lista.
Nesta página também mostro um exemplo básico da cascata do CSS. O arquivo externo, que tem mais abrangência, define a cor do texto como laranja.
Os estilos que estão no elemento style (dentro de head) definem os parágrafos como sendo azuis. Como estes estilos estão dentro do documento, eles tem precedência sobre os do arquivo externo.
Por fim, o atributo style no último item da lista define a cor como sendo cinza. Como o atributo style define estilos em linha, os seus estilos tem precedência sobre todos os outros.