Aplicação dos estilos.
- Um dos conceitos mais interessantes no HTML e Css é o de herança entre
as tags, as tags pai e filhas. O que você define, por exemplo, para <body>, vale para <p>,
<ul>, <td> ( tables ), <ol>, <i>, etc., etc.
- Vale, desde que nenhum estilo seja definido individualmente para estas tags. Conhecendo como funciona
o relacionamento entre os elementos do HTML, você poupa tempo e constrói documentos mais fáceis de
serem lidos.
- Faça este exercício. Crie um documento padrão chamado heranca.html.
- Em seguida, defina a cor azul para a fonte da tag <body>, utilizando CSS.
- Insira um texto e observe o que acontecerá.
Ele herdará a cor definida para <body>. Veja... Eu inseri 2
tags: <H4> e <p> e...
- ... não precisei definir a cor.
- Por que ? Porque <H4> e <p> herdaram a propriedade color de <body>.
Isto vale, também, para outras tags ?
- Sim ! Eu inseri mais algumas linhas no documento e...
- ...gostaria que os nomes destas empresas e dos aplicativos ficassem em itálicos.
- Coloquei, então, cada um entre as tags <i>...</i>,....
- ...produzindo o seguinte resultado.
- As tags <i>...</i> herdaram de <body> a cor da fonte. É o conceito
de herança sendo aplicado.
Ah,... mas eu quero que todo texto itálico fique com cor diferente !
- Você poderia inserir
a propriedade <color> em cada uma das tags itálicas. Como este texto exemplo tem 14
tags <i>, você faria isto 14 vezes.
- Faria... Agora, você conhece CSS e não irá perder tempo ( nem lucidez ).
- Basta definir a formatação para <i> entre <style type="text/css">, utilizando
esta sintaxe:i {color:red}
- E todas as palavras no formato itálico serão alteradas. Veja ! Você faz isto alterando 1 ( eu disse
UMA ) linha apenas.
Ué ?! Cadê a herança entre as tags ?
- No caso das palavras em itálico foi para as cucuias. A herança pode ser quebrada por uma definição
de estilo para uma tag específica. Mais flexível do que isto impossível.
- No Netscape 6.0, tudo OK, o texto é exibido tal e qual no Explorer.
- Agora, vem o seu para-casa. Pegue os seus documentos HTML e faça uma limpeza neles. Crie estilos
para os tipos de tags e limpe os excessos. Eles ficarão mais clean e as manutenções
bem mais fáceis.
Parcerias RicardoHorta.Net
RicardoHorta.Net
Parcerias RicardoHorta.Net
www.ricardohorta.net - Direitos adquiridos - Autor: Ricardo Horta - 05/01/2001
