Folhas de estilo

Disponível somente no TrabalhosFeitos
  • Páginas : 44 (10789 palavras )
  • Download(s) : 0
  • Publicado : 12 de maio de 2011
Ler documento completo
Amostra do texto
de

4 – Folhas de Estilo

4.1. Introdução
4.1.1. O que são folhas de estilo?
Uma folha de estilos é um conjunto de regras que informa a um programa, responsável pela formatação de um documento, como organizar a página, como posicionar e expor o texto e, dependendo de onde é aplicada, como organizar uma coleção de documentos. A maior parte dos programas de editoração eletrônica eprocessadores de texto modernos trabalham com folhas de estilos. O processo consiste em definir um rótulo (nome do estilo) para um determinado parágrafo e em seguida alterar os seus atributos. Todo parágrafo que for rotulado com aquele estilo passará a exibir as características definidas anteriormente. Qualquer alteração nos atributos de um estilo afetará todos os parágrafos que estiverem rotulados com ele.Esta descrição, que se aplica a estilos em processadores de texto e programas de editoração eletrônica, também vale para a Web. Na Web, os "parágrafos" são blocos marcados por descritores HTML como , , etc. Para fazer com que todos os blocos de textos marcados com em um documento sejam exibidos em tamanho de 48 pontos, basta definir a regra:
H1 {font-size: 48pt}

dentro de uma "folha deestilos" aplicada ao documento. A folha de estilos pode ser um arquivo de textos simples (alfabeto ISO-Latin1) com a extensão .css. Para vinculá-lo a uma página HTML, esta deve ter dentro do seu bloco ... o seguinte descritor:

O restante deste artigo tratará dos fundamentos da tecnologia de folhas de estilos aplicáveis ao HTML, chamada de Cascading Style Sheets (folhas de estilo em cascata),mostrando como estabelecer as regras de estilo para um bloco de texto, uma página ou todo um site. Seções específicas abordarão cores, imagens, tipologia e posicionamento. Este texto não é completo. Omitimos propriedades e recursos não suportados nos browsers e nos limitamos àqueles recursos que constam da especificação CSS1 (não incluímos recursos proprietários nem a maior parte das novidades do CSS2que não funcionam nos browsers disponíveis no mercado). Para uma abordagem mais completa, consulte a documentação oficial do W3C: http://www.w3.org/Style/.

4-2

4 – Folhas de Estilo

4.1.2. Para que servem as folhas de estilo
Separar apresentação da estrutura
Com isto é possível voltar a suportar browsers antigos que antes estavam condenados por não conseguirem ler a informação semperdas. Com a informação toda armazenada no HTML (estrutura), a apresentação (estilo) seria uma camada a mais, alterando a disposição do texto, cores, etc. mas sem afetar a estrutura essencial da informação. Isto permite que uma página tenha vários estilos e use scripts (programas embutidos) para decidir qual carregar (em função do browser e da plataforma). Isto é muito menos trabalho que fazer umapágina para cada browser e plataforma, pois a atualização é feita apenas no HTML. Também, com isso, é possível ter uma folha de estilos especial somente para impressão, onde haveria informações de quebra de páginas, etc. (este recurso não faz parte da versão 1 do CSS).

Controle absoluto da aparência da página.
É algo que não se tem com o HTML. Pode-se usar tabelas, GIFs invisíveis de um pixel emais uma dúzia de "macetes" mas não se consegue fazer o texto fluir suavemente em volta de uma imagem irregular, por exemplo. Além do mais, quanto mais sofisticada a técnica, mais difícil é de codificar e mais "sujo" fica o código, o que o torna mais sujeito a erros. Com CSS, pode-se colocar uma imagem em qualquer lugar da página (até fora dela), usando técnicas de posicionamento absoluto ourelativo. Pode-se escolher a posição exata da imagem de background e fazê-la combinar com algo no foreground. As dimensões e posições são exatas e dadas em unidades conhecidas no mundo da tipografia como pixels, pontos, paicas, milímetros.

Páginas mais leves
Com folhas de estilo é possível criar muitas páginas com um layout sofisticado que antes só era possível usando imagens, tecnologias como...
tracking img