Definindo uma folha de estilos para o seu projeto Web
Folha de Estilos Externa
Ideal quando você pretende compartilhar os mesmos estilos entre diversos (ou todos) os documentos de um website. Os estilos devem ser definidos em um arquivo com extensão .css e vinculados no cabeçalho do documento utilizando a tag <link>. Com folhas de estilo externas se obtém os maiores benefícios na utilização do CSS.
Utilizar CSS externo, também melhora a experiência de uso do usuário porque o tamanho dos arquivos diminui, acelerando o carregamento das páginas. O browser utiliza o cache para carregar o mesmo CSS compartilhado por diversos arquivos, semelhante ao o que ocorre com imagens e arquivos Javascript externos.
Importar ou Vincular?
Você pode utilizar CSS externo de duas maneiras: importando ou vinculando. A opção padrão é vincular. A opção importar não funciona no Netscape Navigator 4.x. Ao anexar diversas folhas de estilo externas, a opção Link normalmente é utilizada para a primeira folha de estilos; e Import para as demais.
Utilizar o método Link para vincular diversas folhas de estilos pode fazer com que o navegador ofereça ao visitante uma escolha entre as folhas de estilo que serão utilizadas, o que pode confundir os visitantes e, normalmente não é recomendado nem desejado.
Devido à natureza em cascata das folhas de estilo, quando a primeira é vinculada e a segunda é importada, esta última tem prioridade e sobrescreve quaisquer estilos conflitantes com a primeira.
Uma técnica utilizada com freqüência é posicionar todos os estilos que não são compatíveis com os navegadores antigos nas folhas de estilo que vão ser vinculadas com Import.
Para anexar uma folha de estilos externa utilizando <link>: (padrão – indicado para a primeira folha de estilos externa)
<head>
<link rel=”stylesheet” type=”text/css”
href=”estilo.css” />
</head>
Para anexar uma folha de estilos externa utilizando import: (não suportado por browser antigos)
<style type=”text/css”>
<!–
@import url(”estilo.css”);
–>
</style>
|
Na empresa que trabalha, existe uma área ou profissional de Arquitetura de Informação?
| ||
|
Veja também: | ||