CSS (Cascading Style Sheets ou Folha de Estilos em Cascata) é uma linguagem criada para aplicar em uma página web todas aquelas formatações que costumamos fazer, tais como: mudar a cor de um texto, o tamanho de um título, a borda de uma tabela, imagens de fundo e outras coisas mais. Ao invés de inserirmos no HTML tais formatações, criamos uma página separada e inserimos nela o CSS, toda a formatação e na página web que queremos aplicá-las, criamos um link para a página que contém o CSS. Assim, toda vez que a página web for lida por um navegador, o CSS será puxado da página em anexo e aplicado nos seus devidos lugares.
Vamos a um exemplo:
Criamos um simples arquivo, inserimos o código abaixo e salvamos com o nome estilos.css:
P {
font-size : 12pt;
font-family : arial,helvetica;
font-weight : normal;
}
H1 {
font-size : 36pt;
font-family : verdana,arial;
text-decoration : underline;
text-align : center;
background-color : Teal;
}
BODY {
background-color : #006600;
font-family : arial;
color : White;
}
Em seguida, logo no cabeçalho de nossa página inserimos um trecho de código que chamará a formatação:
- rel=”STYLESHEET” indicando que o link é uma folha de estilo.
- type=”text/css” porque o arquivo é de texto, em sintaxe CSS.
- href=”estilos.css” indica o nome do arquivo fonte dos estilos.
<html>
<head>
<link rel=”STYLESHEET” type=”text/css” href=”estilos.css”>
<title>Página que lê estilos</title>
</head>
<body>
<h1>Página que lê estilos</h1>
<p>
Esta página tem no cabeçalho a etiqueta necessária para linkar com a folha de estilos. É muito fácil.
</p>
</body>
</html>
Os textos que estão entre <H1>, <p> e <body> receberão a formatação de acordo com o que foi escrito no arquivo estilos.css.
Este foi apenas um simples exemplo do uso dessa linguagem poderosa que pode economizar muito tempo no desenvolvimento ou manutenção de uma página. Sugiro que visitem o site do Maujor e vejam o que realmente é possível fazer com CSS.
Posted in 
Tags: 
