GitHub!🏠 - Home
📂 - Repositories
Desenvolvimento WEB
Exercício 1: Sem modificar NADA no HTML, somente utilizando CSS, seus seletores e a propriedade display, faça com que a página exer1.html seja interpretada da seguinte maneira: (vide imagem PDF)
Exercício 2: Sem modificar NADA no HTML, somente utilizando CSS, seus seletores e a propriedade display, faça com que a página exer2.html seja interpretada da seguinte maneira: (vide imagem PDF)
Exercício 3: Sem modificar NADA no HTML, somente utilizando CSS e seus seletores, faça com que a página exer3.html seja interpretada como na imagem abaixo. PS: considerando como referência a nomenclatura de células do Excel, o tamanho de fonte das células A2 e A3 foi de 20px e as cores utilizadas foram branco e #5533ee. (vide imagem PDF)
Exercício 4: No exer4.html, utilizando pseudo-classes (página 2 deste documento), modifique a cor de fundo do link para rosa ao já ter sido visitado, verde ao passar o mouse em cima, preto e sem sublinhado de texto ao não ter sido visitado ainda (teste numa aba anônima). (vide imagem PDF)
Exercício 5: Utilizando pseudo-classes (uma das listadas na página 2) e sem modificar o HTML, altere o CSS do exer5.html para que o resultado seja este: (vide imagem PDF)
Exercício 6: Utilizando display, position, float e propriedades de dimensão (width, height, min-width, maxwidth, min-height, max-height, padding, margin, etc..), crie o layout abaixo seguindo o que se pede: (vide imagem PDF)
Exercício 7: Utilizando gradiente e background-image, modifique: - a navbar para ficar com o gradiente entre as cores #241e1e e #e2dada, direção direita. - a imagem de fundo deve ser a background-image.png e largura de 200px. - a imagem tag-img.jpg deve ficar com largura de 800px e o texto acima dela centralizado, com padding de 50px.
(vide imagem PDF)
Exercício 8: Acesse www.google.com e faça uma cópia da página utilizando apenas HTML e CSS. Você poderá baixar as imagens de ícones e logo. Não será cobrada responsividade, você deve tirar um print de como a página aparece em seu computador para que eu possa analisar. Será cobrada exatidão de medidas conforme a resolução de seu computador.
(vide imagem PDF)
Exercício 9 - extra: Faça o mesmo que se pede no exercício anterior, só que para a pesquisa “Olá mundo” (vide imagem PDF)
https://www.w3.org/TR/CSS1/#contextual-selectors
https://developer.mozilla.org/pt-BR/docs/Web/CSS/Getting_Started/Seletores
https://www.w3schools.com/css/css_link.asp
https://developer.mozilla.org/pt-BR/docs/Web/CSS/Pseudo-classes
https://www.w3schools.com/cssref/pr_background-image.asp
https://www.w3schools.com/cssref/css3_pr_background-size.asp