Para estos dos ejercicios tenéis que revisar la propiedad list-style-image dentro de W3Schools en el apartado CCS Lists. Ahí también podéis ver las opciones list-style-type: none junto con margin y padding a 0 para quitar el formato de una lista.
<!DOCTYPE html>
<html>
<head>
<title>Cosas que visitar</title>
<style>
body {
background-color: olive;
}
h1 {
font-family: Arial, Helvetica, sans-serif;
color: #060;
text-decoration: underline;
text-align: center;
text-shadow: 3px 3px 2px #CCC;
}
li {
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
font-style: italic;
list-style-type: circle;
list-style-position: outside;
list-style-image: url(http://icons.iconarchive.com/icons/gakuseisean/aire/16/Search-icon.png);
color: #000;
}
p {
font-family: Verdana, Geneva, sans-serif;
font-size: 14px;
background-color: #FF9;
color: #03F;
padding:10px;
}
ul {
background: white;
}
table {
width:100%;
}
td {
width:50%;
}
.footer {
text-align: center;
}
address {
text-align: center;
}
a {
color:red;
}
</style>
</head>
<body>
<h1>Cosas que visitar en el próximo viaje</h1>
<table>
<tr>
<td>
<p>a) <a href="https://es.wikipedia.org/wiki/Anexo:Faros_de_Espa%C3%B1a">Faros</a></p>
<ul>
<li>
Cabo Machichaco.</li>
<li>
Gorliz.</li>
<li>
Punta Galea.</li>
<li>
Santa Catalina.</li>
<li>
Cabo Higuer.</li>
<li>
Getaria.</li>
<li>
Isla de Santa Clara.</li>
<li>
La Plata.</li>
<li>
Monte Igueldo.</li>
<li>
Zumaya.</li>
</ul>
</td>
<td>
<p>
b) <a href="https://turismovasco.com/bizkaia/que-ver-bizkaia/museos-de-bizkaia/">Museos</a></p>
<ul>
<li>
Museo Vasco.</li>
<li>
Museo de Bellas Artes de Bilbao.</li>
<li>
Guggenheim Bilbao Museoa.</li>
<li>
Arrantzaleen Museoa.</li>
<li>
Museo Marítimo Ría de Bilbao.</li>
<li>
Museo de la Minería del País Vasco.</li>
<li>
Museo de la Paz de Gernika.</li>
<li>
Ferrería El Pobal.</li>
<li>
Torre Loizaga.</li>
<li>
Museo La Encartada.</li>
</ul>
</td>
</tr>
</table>
<p class="footer">Página realizada por el Estudio EDE</p>
<address>Calle La Encantada 12, Bilbao</address>
</body>
</html>
</body>
</html>
No hay comentarios:
Publicar un comentario