Scribd
Upload
4 views3 pages

Exercise 5

The document provides instructions for creating a web page using HTML and CSS to replicate a specified design. It includes base code for unordered and ordered lists, and outlines the need to add CSS rules for styling, including hover effects for menu items. Additionally, it emphasizes that each list item should function as a link.

Uploaded by

alejandroth.207
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
4 views3 pages

Exercise 5

The document provides instructions for creating a web page using HTML and CSS to replicate a specified design. It includes base code for unordered and ordered lists, and outlines the need to add CSS rules for styling, including hover effects for menu items. Additionally, it emphasizes that each list item should function as a link.

Uploaded by

alejandroth.207
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Part 1

Statement
From the website provided, you must write the CSS rules necessary to
achieve a web page that looks like the following image:

You can modify the HTML code provided to add the identifiers and
classes you need.

Base Code

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>Ejemplo de listas</title>

</head>

<body>

<p>Lista sin elemento gráfico:</p>

<ul>
<li>Elemento 1</li>

<li>Elemento 2</li>

<li>Elemento 3</li>

</ul>

<p>Lista con círculos:</p>

<ul>

<li>Elemento 1</li>

<li>Elemento 2</li>

<li>Elemento 3</li>

</ul>

<p>Lista con cuadrados:</p>

<ul>

<li>Elemento 1</li>

<li>Elemento 2</li>

<li>Elemento 3</li>

</ul>

<p>Lista con números romanos:</p>

<ol>

<li>Elemento 1</li>

<li>Elemento 2</li>

<li>Elemento 3</li>

</ol>

<p>Lista con letras griegas:</p>


<ol>

<li>Elemento 1</li>

<li>Elemento 2</li>

<li>Elemento 3</li>

</ol>

</body>

</html>

Part 2
Statement
Create a web page with a menu labeled with a list that looks the same
as the following image:

.
• When the cursor is over one of the items of the previous list, it must be in orange
color.
• Every item of the previous list must be a link

You might also like