alves.lcc/UC00622
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

estrutura básica

Browse Source
This commit is contained in:
Luís Carlos Alves
2026-04-27 22:21:35 +01:00
parent edcca05f36
commit 18458e7210
2 changed files with 160 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
ex02.html Normal file
View File

@@ -0,0 +1,67 @@
<!doctype html>
<html lang="pt">
<head>
<meta charset="UTF-8" />
<title>Texto Deslizante Horizontal</title>
<style>
body {
margin: 0;
font-family: Arial, sans-serif;
background: #111;
color: white;
}
/* Container */
.marquee {
width: 100%;
overflow: hidden;
background: #222;
padding: 20px 0;
border-top: 2px solid #444;
border-bottom: 2px solid #444;
}
/* Conteúdo que se move */
.marquee-content {
display: flex;
width: max-content;
animation: scroll 15s linear infinite;
}
/* Texto */
.marquee-content span {
margin: 0 40px;
font-size: 24px;
white-space: nowrap;
}
/* Animação */
@keyframes scroll {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-50%);
}
}
</style>
</head>
<body>
<div class="marquee">
<div class="marquee-content">
<!-- DUPLICAR o conteúdo para efeito infinito -->
<span>🚀 Texto deslizante contínuo</span>
<span>🔥 HTML + CSS moderno</span>
<span>💻 Sem JavaScript</span>
<span>✨ Efeito tipo news ticker</span>
<!-- cópia -->
<span>🚀 Texto deslizante contínuo</span>
<span>🔥 HTML + CSS moderno</span>
<span>💻 Sem JavaScript</span>
<span>✨ Efeito tipo news ticker</span>
</div>
</div>
</body>
</html>

93
index.html
View File

@@ -0,0 +1,93 @@
<!doctype html>
<html lang="pt">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Página de Apresentação</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
background-color: #f4f4f4;
}
header {
background-color: #333;
color: white;
padding: 15px;
text-align: center;
}
nav {
background-color: #555;
padding: 10px;
text-align: center;
}
nav a {
color: white;
margin: 0 10px;
text-decoration: none;
font-weight: bold;
}
section {
padding: 20px;
margin: 15px;
background-color: white;
border-radius: 8px;
}
footer {
text-align: center;
padding: 10px;
background-color: #333;
color: white;
}
</style>
</head>
<body>
<header>
<h1>Página de Apresentação</h1>
</header>
<nav>
<a href="#identificacao">Identificação</a>
<a href="#habilitacoes">Habilitações</a>
<a href="#interesses">Interesses</a>
<a href="#contactos">Contactos</a>
</nav>
<section id="identificacao">
<h2>Identificação</h2>
<p>Nome: João Silva</p>
<p>Idade: 25 anos</p>
<p>Localização: Portugal</p>
</section>
<section id="habilitacoes">
<h2>Habilitações</h2>
<ul>
<li>Licenciatura em Engenharia Informática</li>
<li>Curso de Desenvolvimento Web</li>
<li>Certificação em HTML, CSS e JavaScript</li>
</ul>
</section>
<section id="interesses">
<h2>Interesses</h2>
<ul>
<li>Programação</li>
<li>Tecnologia</li>
<li>Leitura</li>
<li>Viagens</li>
</ul>
</section>
<section id="contactos">
<h2>Contactos</h2>
<p>Email: joao@email.com</p>
<p>Telefone: 912 345 678</p>
<p>LinkedIn: linkedin.com/in/joaosilva</p>
</section>
<footer>
<p>&copy; 2026 - João Silva</p>
</footer>
</body>
</html>