Desenvolvimento Web
O EFEITO CASCATA
O efeito cascata do CSS fica evidente quando um elemento (tag) faz com que sua formatação seja herdada a outros elementos que nele estão contidos. No documento a seguir pode-se ver um exemplo prático deste tipo de herança.
Mod 03 - Herança em CSS
div {color
: green; font-family : arial} p {color
: blue; font-size : 30px } b {color
: red }
Parágrafo 1: azul tamanho 30px
Parágrafo 2: azul tamanho 30px + negrito vermelho
Título (h1): dentro de DIV verde fonte arial
Parágrafo 3: azul tamanho 30px + negrito vermelho dentro de DIV arial
CONFLITO DE REGRA
Perceba que o que conteúdo do Negrito () "herda" as formatações do Parágrafo () e até da Divisão () – quando dentro desta - menos a COR, que é o único parâmetro definido em seu CSS.
A COLOCAÇÃO DOS ELEMENTOS EM CSS BASEIABASEIA-SE EM MODELOS DE CAIXAS (BOX MODEL)
Todos os elementos que podem ser vistos numa página da Web ocupam uma determinada área na página. Essa área tem a forma de um retãngulo, que designamos por caixa. O gráfico a seguir representa as diversas áreas que constituem a caixa de um elemento.
•
As quatro bordas limites do elemento (superior, inferior, esquerda e direita) chamam-se border; dentro estará o conteúdo deste elemento.
•
O controle da altura das bordas chama-se height
•
O controle da largura das bordas chama-se width
•
As quatro margens internas (distâncias entre bordas e conteúdo) chamam-se padding
•
•
As quatro margens externas (distância entre as bordas do elemento e as bordas dos demais elementos ou os limites da janela que o contém) chama-se margin
O preenchimento do fundo do elemento chama-se background
LINHAS DE CONTORNO DOS ELEMENTOS (BORDER)
O limite de um elemento designa-se por "border" e ao seu redor podemos desenhar linhas de contorno. O CSS nos permite especificar o estilo, a cor e a espessura das linhas que