Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • Desenvolvimento WEB em Hipertexto - Inicialização (Continuação)

    Enviado por

    frank_sinatra1986
    8 visualizações20 páginas

    Título original

    Desenvolvimento WEB em hipertexto – inicialização (continuação)

    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
    8 visualizações20 páginas

    Desenvolvimento WEB em Hipertexto - Inicialização (Continuação)

    Enviado por

    frank_sinatra1986

    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 20

    Desenvolvimento WEB em hipertexto inicializao (continuao)

    Apresentado por Leandro Silva

    CSS - inicializao
    Cascading Style Sheets (ou simplesmente CSS) uma linguagem de estilo utilizada para definir a apresentao de documentos escritos em uma linguagem HTML. Seu principal benefcio prover a separao entre o formato e o contedo de um documento.
    Fonte: wikipedia

    Estrutura do cdigo CSS


    Objecto: Tag, id, class a aplicar um efeito. Exemplo:

    Estrutura do cdigo CSS


    Propriedades do css: As propriedades variam dependendo do objecto aplicar o efeito. Existem propriedades para Tabelas, Formatao de linhas entre outros Exemplo:

    Estrutura do cdigo CSS


    Formataes: define os valores a aplicar num determinado parmetro ou propriedade do objecto.

    Propriedades do CSS
    As propriedades ou atributos do CSS com j referido aplicam-se dependendo do objecto. As formataes possveis no CSS so: Formatao de Tabelas Formatao de Linhas Formatao de Clulas Propriedades de fundo Propriedades de texto Propriedades de fonte Propriedades de molduras (imagens) Propriedades de Indentao (espaamento em branco entre objectos) Propriedades das Listas Propriedades de classificao (cursor, posio fixa, alinhamento do elemento Propriedades de Dimensionamento Propriedades de Posicionamento

    As propriedades mais usadas:


    Propriedades de Texto (color, text-align) Formatao de Tabelas (border, height, width) Propriedades de Fundo (Background-color, Backgroundimage, Background-position, backgorund-repeat, Url()) Propriedades de Fontes(font-family, font-size, font-style) Propriedades de Moldura (border-width, border-color, border-style) Propriedades da Classificao (float, position) Propriedades de Dimensionamento (height, width) Propriedades de Posicionamento (left, right, top)

    As aces nicas CSS para os links


    :link Define um estilo padro para um link :visited Define um estilo depois de ser visitado. :active Define um estilo depois de ser clicado.

    :hover Define um estilo quando o rato esta por cima

    CSS: folha de estilo nas paginas web


    Existe 3 formas de executar estilos css numa pagina web so: Inline estilo feito em linha na propria tag. top estilo no topo da pagina web. infile estilo em ficheiro com exteno .css Cabe apenas ao programador optar por escolher umas das trs, o mais recomendado para uma maior organizao e mais abrangente em devese usar a infile exemplos:

    CSS inline
    Inline estilo feito em linha na propria tag. S abrange o objecto que esta na tag:

    CSS top
    top estilo no topo da pagina web. Abrange em geral todas as tags com o mesmo tipo caso no se defina um id ou uma class.

    CSS infile
    infile estilo em ficheiro com exteno .css Abrange todas as paginas que tiverem o codigo <link rel=stylesheet >

    CSS infile
    infile estilo em ficheiro com exteno .css Abrange todas as paginas que tiverem o codigo <link rel=stylesheet >

    CSS - Exemplos
    Se definir-se a tag body como objecto de estilo, todos os objectos dentro de essa tag vo ter esse estilo. Por exemplo a tag <font> esta dentro da tag <body> logo <font> vai ter o estilo.

    CSS - Exemplos
    Pode-se definir um atributo id a uma tag (um nico objecto) e aplicar o estilo a esse id com o cardinal # como no exemplo que se segue:

    CSS - Exemplos
    Pode-se definir um atributo class a varias tags (varios objectos) e aplicar o estilo a esse class com o ponto . como no exemplo que se segue:

    CSS - Exemplos
    No exemplo a seguir o estilo aplica-se a um tag div que est dentro de outro tag div. Neste caso so o 1.Css top vai ficar vermelho.

    CSS - Exemplos
    No exemplo a seguir o estilo aplica-se a um tag div onde existe uma tag com class=aqui. Neste caso s o 2.Css top vai ficar vermelho. O cardinal # no faz aqui sentido pois o cardinal s para um nico tag.

    CSS Exercicio 1
    Mudar a cor do texto que est na tag font para vermelho quando o cursor do rato passa por cima do texto.

    CSS Exercicio 2
    Criar um boto dina-mico: mudar a imagem de uma tag div para outra imagem quando o cursor do rato passar por cima do texto.

    Você também pode gostar