A Ordem Cascading Style Sheets Cascade

Você deve estar se perguntando: "Por que arquivos de folha de estilo apelidado folhas cascadingstyle (assim o" C "em CSS)?" Cascading

refere-se a como os estilos são aplicados e em que ordem - isto é, que estilos têm precedência sobre os outros. CSS pode ser implementada de três formas - sozinho ou em combinação uns com os outros - em suas páginas:

• Na linha: CSS inline refere-se a estilos que são diretamente no conteúdo. Este método é o menos desejável porque afeta apenas o conteúdo que os estilos estão diretamente associados.

• Embutido no cabeçalho do documento HTML: Como estilos inline, estilos incorporados são definidos direito em uma página HTML, e não através de uma folha de estilo externa. No entanto, estes estilos de oferecer uma maior flexibilidade, porque eles podem ser aplicados para diversos elementos no interior essa página, tais como todos os n, no documento.

  Estes estilos não, no entanto, afetar partes de outras páginas HTML em seu site-se aplicam somente ao documento em que está incorporado.

• Externo: CSS externa afeta todas as páginas de um site. Você precisa criar um arquivo CSS externo e, em seguida, conectar-se a esse arquivo na seção head de seus documentos HTML. Desta forma, permite-lhe tirar partido de controle de layout de site inteiro rápido.

estilos inline

estilos inline são codificadas diretamente no corpo do documento. Por exemplo, veja o seguinte código HTML para um parágrafo:

Este seria o texto preto

Apesar de estilos inline são rápidos para adicionar na mosca, não recomendamos essa técnica. Em essência, você está trocando um estilo antigo de codificação que criou difícil de manter sites para um novo sabor da mesma coisa.

Por exemplo, no código a seguir, você pode ver que este estilo é aplicado diretamente dentro do

etiquetar e vai afetar apenas este exemplo de um parágrafo. Nenhum outro parágrafos vai assumir os atributos, a menos que você aplicar os mesmos atributos de estilo para eles.

Este seria o texto preto

O problema com a codificação desta maneira é que se você decidir que quer mudar a cor do texto em seu site - ou qualquer outra coisa codificadas com estilos inline - você tem que encontrar todos os lugares que você usou essas técnicas de estilo in-line e alterá-las. estilos inline também fazer um monte de lixo que não é necessário.

Estilos incorporados no cabeçalho do documento

Quando você estilos de incorporação, criar seus estilos CSS na parte da cabeça do seu documento HTML e consulte-as no HTML, como este:

Este texto seria roxo

A vantagem de usar esta técnica é que você pode ter alguns estilos especializados embutidos em apenas um documento HTML. Isto pode vir a calhar se você quiser uma página especial para um evento. As outras páginas do seu site não são afetados por estilos que são incorporados desta forma ou criados em linha.

Se você estiver criando estilos que você pretende usar no seu site (que é o caso mais frequente), não use esta técnica. Você vai acabar com um site que é uma dor no pescoço para atualizar porque você vai ter que abrir cada documento e editar cada estilo incorporado individualmente.

folhas de estilo externas

Usando uma folha de estilo externa é geralmente o método preferido, especialmente se você deseja implementar seus estilos em todo o site. Todas as informações de estilo CSS é criado em um arquivo externo (s). O arquivo está vinculada ao documento HTML na parte da cabeça do HTML, como este:

Esse código vincula o arquivo CSS no documento HTML. O arquivo CSS é style1.css e está na mesma pasta que a página HTML referindo.

Nota: extensão de arquivo da folha de estilo externa é .css. Quando um visitante vai para o seu site, o CSS é carregado junto com o HTML, ea página parece ótimo. A principal vantagem desta técnica é que, se você quer mudar alguma coisa sobre seu projeto ou layout, você pode fazer uma mudança no site inteiro mudando os estilos no arquivo CSS. Você não precisa abrir os arquivos HTML para editá-los. Claro, você precisa visualizar suas páginas antes de publicá-los, mas essa é a regra para todas as páginas da web.

Você também pode criar várias folhas de estilo e ligá-los com o mesmo documento HTML, como este:

Com esta técnica, o site pode ter uma aparência unificada e sentir, e ainda tem a liberdade de ter folhas especializadas de estilo para seções específicas de um grande website. Para tomar o exemplo anterior, style1.css pode definir página de fundo, fontes e cores e ser aplicada a todas as páginas em seu site, enquanto style2.css pode ter alguns estilos específicos utilizados apenas em páginas que apresentam vídeos.

Neste caso, style1.css seria aplicado a cada página em seu site, mas style2.css seria aplicado apenas para páginas com vídeo.