Baixe o app para aproveitar ainda mais
Leia os materiais offline, sem usar a internet. Além de vários outros recursos!
FERRAMENTAS DA PROGRAMAÇÃO WEB - ATIVIDADE PRATICA
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
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
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
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
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
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
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
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
Compartilhar
Prévia do material em texto
CENTRO UNIVERSITÁRIO INTERNACIONAL UNINTER
ESCOLA SUPERIOR POLITÉCNICA
ANÁLISE E DESENVOLVIMENTO DE SISTEMAS
FERRAMENTAS DA PROGRAMAÇÃO WEB
ATIVIDADE PRÁTICA
Raphael cussat machado barcellos, 4176416
Duque de Caxias – Rio de Janeiro
2023
1. Estrutura de pastas do projeto
2. COLOCAR NOME DOS ARQUIVOS
Index.html
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Vincule o arquivo CSS -->
<link rel="stylesheet" type="text/css" href="style.css">
<title>Meu Portfólio</title>
</head>
<body>
<!-- Menu de navegação -->
<nav>
<ul>
<li><a href="index.html">Página Inicial</a></li>
<li><a href="sobre mim.html">Sobre Mim</a></li>
<li><a href="formacao.html">Formacao</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contato.html">Contato</a></li>
</ul>
</nav>
<h1>Página Inicial</h1>
<p>Bem-vindo ao meu portfólio online.</p>
<!-- Adicionar uma imagem -->
<img src="MINHA IMAGEM.jpg" alt="Minha Imagem">
</body>
</html>
Sobre mim.html
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<<!-- Vincule o arquivo CSS -->
<link rel="stylesheet" type="text/css" href="style.css">
<title>Sobre Mim</title>
</head>
<body>
<!-- Menu de navegação -->
<nav>
<ul>
<li><a href="index.html">Página Inicial</a></li>
<li><a href="sobre mim.html">Sobre Mim</a></li>
<li><a href="formacao.html">Formação</a></li>
<li><a href="portfolio.html">Portfólio</a></li>
<li><a href="contato.html">Contato</a></li>
</ul>
</nav>
<!-- Falar sobre mim-->
<h1> Sobre Mim. </h1>
<p> Olá, me chamo Raphael, sou um rapaz pardo, de cabelos crespos, uso óculos, pisciano e sou um Geek. Sou completamente apaixonado por música,
sou fã da cantora canadense de pop punk Avril Lavigne, já fui em 4 shows dela no Brasil. Faço parte de sua fanbase e quando
não estou no trabalho, estou nos forum discutindo sobre musicas da minha artista favorita. Além do mais, sou viciado em games, de preferência,
sou fã dos jogos da Nintendo, minha franquia favorita é Pokémon. Nas horas vagas, tento ser um mestre Pokémon, junto com meu
priminho de 08 anos, que ama passar os feriados e as férias comigo. Amo HQS, ir ao cinema com meus amigos. </p>
<!-- Adicionar uma imagem -->
<img src="MINHA PHOTO.jpg" alt="Minha Photo">
</body>
</html>
Formação.html
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Vincule o arquivo CSS -->
<link rel="stylesheet" type="text/css" href="style.css">
<title>Formação Educacional e Idiomas</title>
</head>
<body>
<!-- Menu de navegação -->
<nav>
<ul>
<li><a href="index.html">Página Inicial</a></li>
<li><a href="sobre mim.html">Sobre Mim</a></li>
<li><a href="formacao.html">Formação</a></li>
<li><a href="portfolio.html">Portfólio</a></li>
<li><a href="contato.html">Contato</a></li>
</ul>
</nav>
<h1>Formação Educacional e Idiomas</h1>
<p> Sou formado em Administração e possuo Pós-Graduação em Gestão de Pessoas e Finanças, ambas pela Unigranrio. Possuo Inglês e Espanhol
e atualmente estou cursando Análise e Desenvolvimento de Sistemas pela Uninter. Trabalho na Prefeiutra Municipal de Duque de Caxias
faço parte do quadro de servidores da Secretaria Municipal de Administração, do Departamento de Recursos Humanos. Minhas
atividas são de técnico previdenciário.
</p>
<!-- Adicionar uma imagem -->
<img src="MINHA FORMATURA.jpg" alt="Minha Formatura">
</body>
</html>
Portfolio.html
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Vincule o arquivo CSS -->
<link rel="stylesheet" type="text/css" href="style.css">
<title>Portfólio</title>
</head>
<body>
<!-- Menu de navegação -->
<nav>
<ul>
<li><a href="index.html">Página Inicial</a></li>
<li><a href="sobre mim.html">Sobre Mim</a></li>
<li><a href="formacao.html">Formacao</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contato.html">Contato</a></li>
</ul>
</nav>
<!-- Conteúdo da página "Portfólio" -->
<h1>Portfólio</h1>
<!-- Exemplo de link -->
<p>Confira meu projeto mais recente: <a href="https://github.com/RaphaelCussat/manipulacao_de_string" target="_blank">Manipulação de String</a>.
</p>
</body>
</html>
Contato.html
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Vincule o arquivo CSS -->
<link rel="stylesheet" type="text/css" href="style.css">
<title>Contato</title>
</head>
<body>
<!-- Menu de navegação -->
<nav>
<ul>
<li><a href="index.html">Página Inicial</a></li>
<li><a href="sobre mim.html">Sobre Mim</a></li>
<li><a href="formacao.html">Formação</a></li>
<li><a href="portfolio.html">Portfólio</a></li>
<li><a href="contato.html">Contato</a></li>
</ul>
</nav>
<h1>Contato</h1>
<p>Use o formulário abaixo para entrar em contato:</p>
<form>
<label for="nome">Nome:</label>
<input type="text" id="nome" name="nome" placeholder="Raphael Cussat Machado Barcellos" required>
<label for="email">E-mail:</label>
<input type="email" id="email" name="email" placeholder="raphaelcussat93@gmail.com" required>
<label for="mensagem">Mensagem:</label>
<textarea id="mensagem" name="mensagem" rows="4" placeholder="Escreva sua mensagem aqui" required></textarea>
<button type="submit">Enviar</button>
</form>
</body>
</html>
Style.css
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
nav {
background-color: #333333;
color: #fff;
text-align: center;
}
nav ul {
list-style: none;
padding: 0;
}
nav ul li {
display: inline;
margin-right: 20px;
}
nav ul li a {
text-decoration: none;
color: #fff;
}
3. COLOCAR IMAGEM DO CÓDIGO EM EXECUÇÃO (index)
4. Colocar endereço onde publicou o site
Github: https://github.com/RaphaelCussat/Fundamentos-da-Programa-o-Web
Site: https://raphaelcussat.000webhostapp.com/portfolio.html
1Materiais relacionados
Perguntas relacionadas
Compartilhar