Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • Aula 03

    Enviado por

    Geilson Silva
    16 visualizações23 páginas

    Título original

    aula03

    Direitos autorais

    © Attribution Non-Commercial (BY-NC)

    Formatos disponíveis

    PPTX, PDF, TXT ou leia online no Scribd

    Você considera este documento útil?

    Este conteúdo é inapropriado?

    Denunciar este documento

    Direitos autorais:

    Attribution Non-Commercial (BY-NC)
    Baixe no formato PPTX, PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    16 visualizações23 páginas

    Aula 03

    Enviado por

    Geilson Silva

    Direitos autorais:

    Attribution Non-Commercial (BY-NC)
    Baixe no formato PPTX, PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    de 23

    Desenvolvimento WEB I Aula 03

    Modelos em camadas
    Camada de Contedo: A camada de contedo , sem sombra de dvida, a mais importante de todas. onde colocamos a parte mais preciosa do nosso site, aquilo que realmente faz a diferena o contedo. Onde utilizamos o HTML

    Modelos em camadas
    Camada de apresentao: A tecnologia utilizada para esta camada ser o Cascading Style Sheets (CSS) que definir as propriedades visuais para cada elemento do contedo. Esta camada ir aplicar o layout criado visando tornar o contedo das pginas mais atraente.

    CSS
    Cascading Style Sheet (CSS) um padro para definio de propriedades visuais aos marcadores HTML. Chamado em portugus por Folha de Estilo em Cascata, com ele, pode-se definir o estilo de toda uma pgina. Por exemplo cor de fundo da pgina, tipos de fonte padro, formatao de ttulos, margens, entre outros.

    CSS
    Uma Folha de Estilos em Cascata denominada externa quando as regras esto declaradas em um documento a parte da pgina HTML. Este arquivo separado possui a extenso .css. Folhas de Estilo em Cascata externa so ideais para serem aplicadas a vrias pginas. Com uma folha de estilo externa, pode-se mudar a aparncia de um site inteiro num nico arquivo.
    Para importar ou referenciar uma Folha de Estilos em Cascata num documento HTML usa-se, dentro do marcador <head>.

    CSS
    Referenciar uma folha de estilos

    Importao da folha de estilos

    CSS

    Utilizao de uma folha de estilos incorporada

    CSS

    CSS
    Regras Bsicas Regras CSS so declaraes que seguem uma sintaxe prpria e definem como sero aplicados estilos a um ou mais elementos do HTML. Um conjunto de regras CSS formam uma Folha de Estilos em Cascata. Existem trs formas de se definir um estilo:

    CSS
    Regras Bsicas 1 M o marcador para o qual se esta aplicando o estilo, podendo ser composto de vrios marcadores (Exemplo: P, H1, H3). Desta forma definido que todos os marcadores M tero o estilo definido.

    CSS
    Regras Bsicas 1 M o marcador para o qual se esta aplicando o estilo, podendo ser composto de vrios marcadores (Exemplo: P, H1, H3). Desta forma definido que todos os marcadores M tero o estilo definido.

    CSS
    Regras Bsicas 2 Desta forma criado um estilo classid ou classname que pode ser aplicado a marcadores do tipo M.

    CSS
    Regras Bsicas 3 Semelhante ao anterior, este define estilos genricos que podem ser aplicados para quaisquer tipos de marcadores.

    CSS
    Exemplos - Regra 1

    Esse exemplo sobrescreve as configuraes de estilo para todas as tags de pargrafo p

    CSS
    Exemplos - Regra 2

    Esse exemplo sobrescreve as configuraes de estilo para todas as tags input desde que tenham a propriedade id=input_1

    CSS
    Exemplos - Regra 2

    Esse exemplo sobrescreve as configuraes de estilo para todas as tags input desde que tenham a propriedade class=input_1

    CSS
    Exemplos - Regra 3

    Esse exemplo sobrescreve as configuraes de estilo para todas as tags que possuem a propriedade id=idFundoVerde

    CSS
    Exemplos - Regra 3

    Esse exemplo sobrescreve as configuraes de estilo para todas as tags que possuem a propriedade class=fundoVerde

    Propriedades para customizao

    CSS

    Background-color Cor de fundo margin Espessura de margem para os elementos Padding Espaamento entre o contedos e as bordas do elemento Width Largura do elemento Heigth Altura do elemento

    Propriedades para customizao

    CSS

    Font Color: Cor do texto Font-size: Tamanho da fonte Font-family: Tipo da fonte (verdana, helvetica, arial ) Background: background-image: imagem de fundo background-repeat: repetio do background no-repeat repeat-x repeat-y Background-position: Posio do background

    Propriedades para customizao

    CSS

    Border Define propriedades da borda do elemento color: cor do elemento Style: tipo da borda Width: expessura da boda

    Propriedades para customizao tag a

    CSS

    Link: Propriedades para os links no visitado ainda Visited: Propriedades para os links visitados Hover: Propriedades para quando o cursor estiver em cima do link Active: Propriedades para quando o link for clicado

    Criando um menu em CSS Para criarmos um menu utilizando o CSS devemos utilizar a tag <ul> A tag <ul> o padro para representar listagens

    CSS

    Você também pode gostar