Portfólio - Desafios 01, 02 e 03

•

ENIAC

0

Fausto Cruz

13/09/2021

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Você viu 3, do total de 6 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Você viu 6, do total de 6 páginas

E aí, curtiu este material?

Ajude a incentivar outros estudantes a melhorar o conteúdo

Gostou desse material? Compartilhe! 🧡

Html5, Css3, Javascript

1.167 Materiais compartilhados

Baixe o app para aproveitar ainda mais

Leia os materiais offline, sem usar a internet. Além de vários outros recursos!

Prévia do material em texto

............................................................................................................................... 
 
 
 
ENGENHARIA DA COMPUTAÇÃO – TECNOLOGIA WEB – HTML 5, CSS E 
JAVASCRIPT 
 
FAUSTO EUSÉBIO DA CRUZ - 289422020 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
PORTFÓLIO DE DESAFIO 
RESOLUÇÃO DOS DESAFIOS DOS ASSUNTOS 1, 2 E 3 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
........................................................................................................................................ 
Guarulhos 
2021 
 
 
 
 
 
 
FAUSTO EUSÉBIO DA CRUZ 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
PORTFÓLIO DE DESAFIO 
RESOLUÇÃO DOS DESAFIOS DOS ASSUNTOS 1, 2 E 3 
 
 
 
 
 
 
 
 
Trabalho apresentado ao Curso de Engenharia da 
Computação do Centro Universitário ENIAC para a 
disciplina Tecnologia WEB, HTML 5, CSS e JavaScript. 
 
Prof. Ricardo Magalhães Silva 
 
 
 
 
 
 
 
 
Guarulhos 
2021 
 
 
 
 
DESAFIO 01 
 
O seu professor de Ferramentas de Desenvolvimento Web lançou os 
seguintes desafios para a turma: 
 
Qual é a função do doctype em um documento HTML? 
 
O doctype não é uma tag HTML e, com isto, o mesmo deve ser declarado antes 
de iniciar o desenvolvimento do site com as tag HTML. O doctype é uma declaração 
que tem como objetivo informar ao navegar WEB qual é a versão HTML que está 
sendo carregada no arquivo do site. 
A versão 4 do HTML ou anteriores eram baseadas no SGML que utilizavam 
declarações do tipo DTD (Document Type Declaration). Com a checada do HTML5, 
este deixou de ser baseado em SGML, permitindo a simplificação da declaração do 
doctype. 
 
Quais são os oito tipos de doctype que podem ser encontrados nos 
documentos atuais e a característica de cada um? 
 
Nos dias de hoje, com o uso do HTML5, a declaração utilizada é a <!doctype 
html> que tem como seu principal objetivo informar aos navegadores sobre sua versão 
atual, ao carregar uma página. Para a versão do HTML4 ou anteriores, bem como 
XHTML1.0 e XHTML1.1 utilizava-se as seguintes declarações do doctype: 
1) HTML 4.01 Strict: <!doctype html pulic “-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> é uma declaração que contém 
todos os elementos e atributos HMTL, mas não inclui elementos de 
apresentação ou depreciados, tais como fonte. Além disso, ele não 
permite o uso de Framesets; 
2) HTML 4.01 Transational: <!doctype html public “-//W3C//DTD HTML 
4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> este 
contém todos os elementos e atributos do HTML, incluindo os de 
 
 
apresentação e reprovados, tais como fonte. 
3) HTML 4.01 Frameset: <!doctype html public “-//W3C//DTD HTML 4.01 
Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> esta 
declaração possui funcionalidades idênticas ao “Transational”, tendo o 
acrescimento da permissão do uso de Framesets. 
4) XHTML 1.0 Strict: <!doctype html public “-//W3C//DTD XHTML 1.0 
Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">; 
5) XHTML 1.0 Transational: <!doctype html public "-//W3C//DTD XHTML 
1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">; 
6) XHTML 1.0 Frameset: <!doctype html public "-//W3C//DTD XHTML 1.0 
Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
frameset.dtd">; 
7) XHTML 1.1: <!doctype html public "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> Esta declaração 
possui as mesmas características do XHTML 1.0 Strict. Porém, ela 
ainda permite adicionar módulos. 
 
 
DESAFIO 02 
 
Uma escola contratou você para ajudá-los a colocar em seu site todo o 
conteúdo que é trabalhado com os alunos ao longo do ano. Uma das professoras das 
séries iniciais está trabalhando as cores com a sua turma e gostaria de organizá-las 
no site de forma a ficar claro que as cores classificam-se em três tipos e que, cada um 
desses tipos, possui cores específicas. 
 
Levando em consideração que em documentos hipertexto, as listas servem 
para relacionar itens, normalmente dispostos com marcadores, para facilitar a 
visualização dos elementos que pertencem a determinados grupos, ajude a 
professora criando um documento HTML que apresente uma lista não ordenada que 
relacione a classificação das cores (primárias, secundárias e terciárias). Cada uma 
dessas listas deve conter uma lista ordenada alinhada, que apresente as respectivas 
cores de cada uma, conforme imagem a seguir: 
 
 
Desafio02.txt
 
 
 
 
DESAFIO 03 
 
 Leonardo é aluno da disciplina de Ferramentas de Desenvolvimento Web e 
está fazendo uma avaliação final do semestre. A quinta e última questão traz o 
seguinte contexto: 
 
 
 
Você é um desenvolvedor de sites e precisa definir qual o tipo de seletor 
de CSS é usado para a formatação dos códigos HTML. Lembre-se que, na página 
a ser criada, várias formatações serão iguais em vários blocos, com códigos 
idênticos sendo reutilizados. Justifique o motivo da escolha da regra. 
 
Existem três formas nas quais podem ser utilizadas as regras de estilos do 
CSS, sendo elas: 
• Inline: as regras são definidas dentro de cada TAG HTML; 
• Interna: as regras são definidas dentro do cabeçalho de um 
documento HTML; 
• Externa: as regras são definidas em um documento separado aos 
documentos HTML. Desta forma, para carregá-lo, se faz necessário a 
criação de um link em cada documento HTML; 
 
Com base nas informações acima citadas, podemos ter duas opções viáveis para o 
desafio solicitado, dependendo do que de fato será construído. Se considerarmos 
que será criado apenas uma única página HTML, o mais recomendável seria a 
aplicação da regra de seletor “Interna”, haja visto que o código de formatação será 
idêntico para vários blocos semelhantes. Porém, caso seja considerada a criação de 
um site com múltiplas páginas HTML, o mais viável seria a criação de um documento 
separado com as regras de estilo CSS, ou seja, a utilização “Externa”.