Fomateando texto en HTML
Ir a la navegación
Ir a la búsqueda
Sumario
Enunciado Tarefa 1 - Parágrafos e formateo de texto
Crea unha páxina web que conteña:
- un título
- dous niveles de cabeceras
- unha cita
- un texto preformateado
- un salto de liña
- un salto de párrafo a nivel temático
- tres párrafos
- con texto resaltado con prioridade
- resaltado coa maior prioridade
- texto subliñado.
Enunciado Tarefa 2 - Listas
Crea unha páxina web que conteña:
- unha lista sen orden de tres items (por exemplo café, auga e leite)
- unha lista con orden de tres items (por exemplo os mesmos)
- unha lista mixta (por exemplo, de café pode haber só e con leite, e do con leite Latte e Capuccino
- unha lista de definición con dous items
Resultado agardado
Enunciado Tarefa 3 - Dando estrutura á web
Nota. Este exercicio é de iniciación para practicas. Con HTML5 hai etiquetas semánticas que permiten facer o requirido mellor!
Crea unha páxina web que serva como cabeceira dun sitio web que:
- terá unha imaxe
- centrada no medio da páxina
- co seu tamaño ampliado por medio dos atributos height e width
- â súa altura será de 100px
- a súa anchura comprenderá a mitade da fiestra do navegador
Solucións
Solución tarefa 1 - Parágrafos e formateo de texto
<!DOCTYPE html>
<html>
<head>
<title>Exercicio 1</title>
</head>
<body>
<h1>Resolución do exercicio - Uso de encabezado h1</h1>
<h2>Parte primeira - Un encabezado h2</h2>
<em>Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...</em>
<pre>
*** *** *** *** ***
*** Texto sen ***
*** formato ***
*** *** *** *** ***
</pre>
<hr>
<h2>Segunda parte - Outro encabezado h2 </h2>
<p>Tal como se indica en el <strong>lorem ipsum - uso de etiqueta strong</strong></p>
<b>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sit amet
orci a massa accumsan scelerisque. Nullam cursus risus augue, cursus fermentum
elit cursus ut. Ut a pharetra felis. Sed at varius tellus.
<br>
Fusce aliquam malesuada massa at faucibus. Duis pharetra neque ac sapien
tincidunt, at cursus metus mattis. Sed accumsan magna urna, et molestie ante
dictum nec.<u>Texto subliñado</u>, commodo ac dui sed, tempor lobortis nibh.
Vivamus condimentum varius lectus, mattis cursus nisi faucibus vitae. Nam maximus
quam ligula, eget varius lacus consectetur vitae.
</p>
<p>Orci varius natoque penatibus et magnis dis parturient montes, nascetur
ridiculus mus. Nam justo justo, luctus ac maximus ut, tincidunt eu ligula. Nunc
eleifend ante in leo lacinia porttitor. Curabitur vestibulum enim vel nulla
porttitor, sed varius nulla mollis. In dignissim nisl at ligula mattis suscipit.
Integer suscipit ornare nisi, nec gravida lorem. Proin egestas blandit nulla quis
volutpat.
</p>
<p>Etiam blandit ultrices tortor, vitae tristique urna pellentesque vel. Sed
consectetur, metus ut volutpat tempor, quam ligula rhoncus justo, sed faucibus
tortor arcu nec mi. Nulla luctus, lorem quis porttitor bibendum, dolor quam
consectetur risus, eu eleifend leo ligula non risus.
</p>
</b>
</body>
</html>
Solución tarefa 2 - Listas
<!DOCTYPE html>
<html>
<head>
<title>Exercizo listas</title>
</head>
<body>
<h1>Lista desordenada</h1>
<ul>
<li>Café</li>
<li>Auga</li>
<li>Leite</li>
</ul>
<h1>Lista ordenada</h1>
<ol>
<li>Café</li>
<li>Auga</li>
<li>Leite</li>
</ol>
<h1>Lista mixta</h1>
<ul style="list-style-type:circle;">
<li>Café
<ol>
<li>So</li>
<li>Con leite</li>
<ol type="a">
<li>Latte</li>
<li>Capuccino</li>
</ol>
</ol>
<li>Auga</li>
<li>Leite</li>
</ul>
<h1>Lista de definición</h1>
<dl>
<dt>Coche</dt>
<dd>Vehículo de catro ruedas</dd>
<dt>Moto</dt>
<dd>Vehículo de dúas rodas</dd>
</dl>
</body>
</html>
Solución tarefa 3 - Dando estrutura á web
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Exercizo 3 - estrtura da páxina e uso de atributos de imaxe </title>
</head>
<body>
<p align="center">
<img src="https://www.publicdomainpictures.net/pictures/270000/nahled/roosterlogo-silhouette-clipart.jpg" alt="imaxe_cabecera" width="50%" height="100"/>
</p>
</body>
</html>
