Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • Somativa Unica CSS1

    Enviado por

    TheNoob Guy
    2 visualizações4 páginas

    Título original

    Somativa unica CSS1

    Direitos autorais

    © © All Rights Reserved

    Formatos disponíveis

    PDF, TXT ou leia online no Scribd

    Você considera este documento útil?

    Este conteúdo é inapropriado?

    Denunciar este documento

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    2 visualizações4 páginas

    Somativa Unica CSS1

    Enviado por

    TheNoob Guy

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    de 4

    .

    INSTITUTO DE TRANSPORTES E COMUNICAÇÕES

    MÓDULO: APLICAR CSS EM PÁGINAS WEB


    INSTRUMENTO DE AVALIAÇÃO 1
    Nível & Título de Qualificação:
    Título do Módulo: Código do Módulo:
    Nome do Estudante: Código do Estudante:
    Instrumento da Avaliação nº: Resultado de Aprendizagem nº:
    Somativa: 1ª Reavaliação 2ª Reavaliação Data: _____/______/20___
    RESULTADO DA AVALIAÇÃO
    REAÇÃO DO AVALIADOR: Somativa: 1ª Reavaliação: 2ª Reavaliação:
    Assinatura do Avaliador(a): Data: _____/______/20___
    Assinatura do Estudante: Data: _____/______/20___
    Assinatura do Verificador Interno: Data: _____/______/20___

    Resultado de aprendizagem 1. Identificar os comandos CSS

    1. Dos trechos de códigos abaixo, indica os que representam trechos em CSS.

    A. <body bgcolor=#FF0000>
    B. body {background-color: #FF0000;}
    C. p, li, h1 {color: red;}
    D. h1 { font-size: 60px; text-align: center;}

    2. O código css abaixo posiciona e estiliza o título de uma página web. Descreva o efeito de
    cada linha.
    h1 {
    margin: 0;
    padding: 20px 0;
    color: #00539F;
    text-shadow: 3px 3px 1px black;
    }

    Resultado de aprendizagem 2. Implementar CSS em páginas web

    3. Existem três maneiras de aplicar estilos CSS a páginas HTML, são elas: Inline, declarando
    na mesma página e utilizando um arquivo externo. O código abaixo representa uma página
    web cujo o código CSS foi declarado em inline. Reescreva o mesmo código utilizando o
    método interno e externo.
    <!DOCTYPE html>
    <html>
    <head>
    <title> Aplicar CSS em páginas web </title>
    <meta charset="UTF-8">
    </head>
    <body style="background-color: #fff1cb;">
    <h1 style="color: #e83e0f;"> Implementar diferentes formas CSS em páginas web</h1>
    <p style="color: #0d7cff; font-size: 18px;">
    P1. Identificar os diferentes comandos CSS
    </p>
    <p>
    P2. Identificar as funcionalidades dos comandos CSS
    </p>
    </body>
    </html>

    1
    Resultado de aprendizagem 3. Usar CSS para definir o fluxo de conteúdos, posicionamento,
    estilo e disposição dos elementos nas páginas.

    4. Considere o código html abaixo. Nele esta representado a estrutura base de uma página
    inicial do site da “Clínica Transcom”.
    <!DOCTYPE html>
    <html lang="en-us">
    <head>
    <meta charset="utf-8">
    <title>Clínica Transcom</title>
    </head>
    <body>
    <!-- Aqui está nosso cabeçalho principal que é usado em todas as páginas do site -->
    <header>
    <h1>Clínica Transcom</h1>
    </header>
    <nav>
    <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Consultas</a></li>
    <li><a href="#">Exames</a></li>
    <li><a href="#">Especialidades</a></li>
    </ul>
    <!-- Um formulário de pesquisa navegação no site. -->
    <form>
    <input type="search" name="q" placeholder="Pesquisar">
    <input type="submit" value="Go!">
    </form>
    </nav>
    <!-- Aqui terá o conteúdo principal da página inicial do site -->
    <main>
    <!-- o conteúdo adicional aninhado dentro do conteúdo principal -->
    <aside>
    <h2>Especialidades</h2>
    <ul>
    <li><a href="#">Alergologia</a></li>
    <li><a href="#">Cardiologia</a></li>
    <li><a href="#">Urologia</a></li>
    <li><a href="#">Cirurgia</a></li>
    </ul>
    </aside>
    <!-- Contém um artigo -->
    <article>

    </article>

    </main>
    <!-- E aqui está o nosso rodapé principal usado em todas as páginas do site -->
    <footer>
    <p>©Copyright 2023 by TPW4 - Somativa - UC TIC025007 - Implementar de
    diferentes formas CSS em páginas web. All rights reversed. </p>
    </footer>
    </body>
    </html>

    a) Crie um código estilo.css que dá um layout a página como da figura abaixo.

    2
    b) Acrescente o código CSS para que as opções das barras de navegação horizontal e
    vertical mudem de cor para laranja (#ff6400), quando o ponteiro do mouse passa sobre
    ela.
    c) Mantendo o layout e outros elementos ora concebidos, crie uma página consultas.html
    contendo um formulário como na figura a seguir:

    O perímetro e tamanho do formulário


    devem obedecer as seguintes características:
    .formulario{
    max-width: 450px;
    background: #FAFAFA;
    padding: 30px;
    margin: 50px auto;
    box-shadow: 1px 1px 25px
    rgba(0, 0, 0, 0.35);
    border-radius: 10px;
    border: 6px solid #305A72;
    }

    d) A página consultas.html é acessível através da opção Consultas do menú horizontal

    Resultado de aprendizagem 4. Identificar os conceitos de desenho de interfaces


    5. Enumere 4 características de User Interfaces (UI) de sucesso

    6. O que é um site responsivo? E quais as suas vantagens?

    Resultado de aprendizagem 5. Identificar regras de acessibilidade e usabilidade

    7. Enumere 4 regras de regras de acessibilidade para navegação web

    8. Enumere as 7 regras básicas de usabilidade na web

    3
    Bom Trabalho.

    Você também pode gostar