Actividad de Construcción Aplicada 3elsy

Actividad de construcción aplicada 3
Por
Elsy Guerrero
Ingeniería de sistemas (modalidad virtual)
Programación web
Presentado a
José Vicente Toro
Corporación Unificada Nacional (Cun)
Abril 2020
Actividad de construcción aplicada 3
Página de un restaurante:
Página principal o índex
Código HTML
<!DOCTYPE html>
<html>
<head>
<title>Interfaz</title>
<meta charset="uft-8">
<link rel="stylesheet" type="text/css" href="Index.css">
</head>
<body id="body">
<div id="contenedor">
<div>
<table>
<tr>
<td><center><img src="C:\Users\PC\Desktop\pagina
elsy\imagenes\33aa9bbf9ef5fee9e3f3184d20722db8.png" id="logo"></td></center>
<td class="sitios"><center><a href="Escríbenos.html"><img
src="C:\Users\PC\Desktop\formulario avanzado\ejemplo programacion
web\imagenes\images.png" class="img"><figcaption>
<center><h4>Formulario</h5></figcaption></center></a></td>
</tr>
</table>
</div>
<div id="menu" > <center><h1> Menú </h1></center>
<ul>
<li> <a href="Pescado.html"> Pescado </a> </li>

<li> <a href="Carnes.html"> Carnes </a> </li>
<li> <a href="Pastas.html"> Pastas </a></li>
<li> <a href="Bebidas.html"> Bebidas </a> </li>
</ul>
</div>
<div id="galeria"> <center><h1> Algunos de los platos tipicos </h1></center>

<table id "tabla1">
<tr>
<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo programacion
web\imagenes\descarga (2).jpg" class= "cuadros"<figcaption>
<center><h4>Pastas</h5></figcaption></center> </a></td></td>
<center><h4>Pescado</h5></figcaption></center></td>
<center><h4>Postres</h5></figcaption></center></td>
</tr>
<tr>
<center><h4>bebidas</h5></figcaption></center></td>
<td ><img src="C:\Users\PC\Desktop\pagina elsy\imagenes\9.jpg" class= "cuadros" <figcaption>
<center><h4>Bebidas</h5></figcaption></center></td>
web\imagenes\frutas.jpg" class= "cuadros"<figcaption>
<center><h4>Arroz</h5></figcaption></center></td>
</tr>
</table>
</div>
<div id="piePajina">
<p> <center> <em> <br>« Copyright © 2020 Elsy Guerrero » </em> </center></p>
</div>
</div>
</body>
</html>
Código CSS
*{
margin: 0;
padding: 0;
#contenedor{
background-color: #8B4513;
height: 980px;
width: 1350px;
#logo{
height:250px;
width: 250px;
.imagen{
height:150px;
width: 250px;
border-radius: 1em;
margin: 1em;
background: #8B4513;
#nav{
height: 250px;
width:1320px;
border-radius: 1em;
margin: 1em;
.img{
height: 175px;
width: 257px;
#menu{
height: 300px;
width: 500px;
border-radius: 1em;
float: left;
margin: 0.5em;
#galeria{
height: 350px;
width: 800px;
border-radius: 1em;
float: left;
margin: 0.5em;
#piePajina{
height: 50px;
width: 1315px;
border-radius: 1em;
float: left;
margin: 0.5em;
div#menu ul li{
margin-top: 15px;
font-family: tahoma;
font-size: 18px;
width: 250px;
padding-top: 10px;
padding-bottom: 10px;
border-radius: 0px 20px 20px 0px;
padding-left: 20px;
-webkit-transition: padding-left 0.6s ;
color: white;
margin-left: 50px;
.cuadros{
height: 50%;
width: 80%;
border-radius: 1em;
#pescaderia{
height: 150px;
width:1300px;
border-radius: 1em;
margin: 1em;
}
Formulario
Código HTML
<html>
<head>
<title> Escribenos </title>
<link rel="stylesheet" type="text/css" href="Escribenos.css">
</head>
<body>
<div id="contenedore">
<center><table>
<tr>
<td> <img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo programacion
web\imagenes\20.jpg" class="img"></td>
<td><center></br> <h3> datos personales </h3>
<br> <form method = "post" action = "">
Nombre:
<input type = "text" name = "txtNombre"/>
</br>
</br>Apellido:
<input type = "text" name = "txtApellido"/>
</br>
</br></br> Pais de origuen:</br>
Pais:
<select name="pais">
<option> Colombia </option>
<option> Brazil </option>
<option> España </option>
<option> Japon </option>
<option> Nueva Zelanda </option>
</select> <BR>
</br> E-mail:
<input type = "text" name = "txtCorreo" /> </br> </br>
</br>
<input type = "submit" name = "btnEnviar" value = "Enviar datos"/>
</form></center></td>
<td> <img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo programacion
web\imagenes\1.jpg" class="img"> </td>
<tr>
<table></center>
</div>
</body>
</html>
Código CSS
*{
margin: 0;
padding: 0;
}
#contenedore{
background-color: #8B4513;
height: 980px;
width: 1350px;
}
.img{
height: 200px;
width: 250px;
}
Página de carnes
Código HTML
<!DOCTYPE html>
<html>
<head>
<title>Carnes</title>
</head>
<body id="body">
<div>
<table bolder:1px>
<tr>
<td"><center><img src="C:\Users\PC\Desktop\pagina
</tr>
</table>
</div>
<div id="pescaderia"> <center><h1> Carnes... </h1></center>
<br><br>
</table>
</div>
<ul>
<li> <a href="Pescado.html">Pescado </a></li>
<li> <a href="Pastas.html">Pastas </a></li>
<li> <a href="Bebidas.html">Bebidas </a></li>

<li> <a href="Index1.html"> Página principal </a> </li>
</ul>
</div>
<div id="galeria"> <center><h1> <p> Escoja el plato que decea degustar..</p>

</h1></center>
<table id "tabla1">
<tr>
<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

programacion web\imagenes\17.jpg" class= "cuadros">
<figcaption> <center><h4>Pierna de cerdo $

15.000</h5></figcaption></center</td></td>

<figcaption> <center><h4>Costillas de res $

19.000</h5></figcaption></center</td></td></td>

<figcaption> <center><h4>Pechuga
$12.000</h5></figcaption></center</td></td>
</tr>
<tr>

<figcaption> <center><h4>Lomo de res

<figcaption> <center><h4>Muchacho relleno $


<figcaption> <center><h4>Pollo asado $

</tr>
<br><br>
</table>
</div>
<p> <center> <em> <br>« Copyright © 2020 Elsy Guerrero » </em>

</center></p>
</div>
</div>
</body>
</html>
Código CSS es el mismo para las siguientes páginas
*{
margin: 0;
padding: 0;
#contenedor{
height: 980px;
width: 1350px;
.imagen{
height: 17%;
width: 17%;
border-radius: 1em;
margin: 1em;
#nav{
height: 350px;
width:1300px;
border-radius: 1em;
margin: 1em;
.sitios{
height: 175px;
width:257px;
border-radius: 1em;
margin: 2px;
.img{
height: 175px;
width: 257px;
#menu{
height: 400px;
width: 500px;
border-radius: 1em;
float: left;
margin: 0.5em;
#galeria{
height: 500px;
width: 800px;
border-radius: 1em;
float: left;
margin: 0.5em;
#piePajina{
height: 50px;
width: 1315px;
border-radius: 1em;
float: left;
margin: 0.5em;
}
div#menu ul li{
margin-top: 15px;
font-family: tahoma;
font-size: 18px;
width: 250px;
padding-top: 10px;
padding-bottom: 10px;
border-radius: 0px 20px 20px 0px;
padding-left: 20px;
-webkit-transition: padding-left 0.6s ;
color: white;
margin-left: 50px;
.cuadros{
height: 50%;
width: 80%;
border-radius: 1em;
#pescaderia{
height: 150px;
width:1300px;
border-radius: 1em;
margin: 1em;
Página de bebidas
Código HTML
<!DOCTYPE html>
<html>
<head>
<title>Bebidas</title>
</head>
<body id="body">
<div>
<table>
<tr>
</tr>
</table>
</div>
<div id="Bebida"> <center><h1> Bebidas... </h1></center>
<BR><BR><BR>
</table>
</div>
<ul>
<li> <a href="Pescado.html">Pescado </a> </li>
<li> <a href="Carnes.html">Carnes </a></li>
<li><a href="Pastas.html"> Pastas </a></li>
</ul>
</div>
<div id="galeria"> <center><h1> <p> Escoja la bebida que decea degustar..</p>

</h1></center>
<table id "tabla1">
<tr>

<figcaption> <center><h4>Refresco de fresa

$7.000</h5></figcaption></center</td>

<figcaption> <center><h4>Té helado $6.000</h5></figcaption></center</td>

<figcaption> <center><h4>Limonada de piña

$4.000</h5></figcaption></center</td>
</tr>
<tr>

<figcaption> <center><h4>Limonada

<figcaption> <center><h4>Salpicon $9.000</h5></figcaption></center</td>

<figcaption> <center><h4>Refajo $3.000</h5></figcaption></center</td>
</tr>
</table>
</div>

</center></p>
</div>
</div>
</body>
</html>
Página de pescados
Código HTML
<!DOCTYPE html>
<html>
<head>
<title>pescados</title>
</head>
<body id="body">
<div>
<table bolder:1px>
<tr>
</tr>
</table>
</div>
<br><br>
<div id="pescaderia"> <center><h1> Pescaderia... </h1></center>

</table>
</div>
<ul>
<li> <a href="Carnes.html">Carnes </a></li>
<li> <a href="Pastas.html">Pastas </a></li>
<li> <a href="Bebidas.html">Bebidas </a></li>
</ul>
</div>

</h1></center>
<table id "tabla1">
<tr><br><br>

<figcaption> <center><h4>Mojarra
$13.000</h5></figcaption></center></a></td></td>
<figcaption> <center><h4>Sancocho $10.000</h5></figcaption></center></td>

<figcaption> <center><h4>Solmon $20.000</h5></figcaption></center></td>
</tr>
<tr>

<figcaption> <center><h4>Bagre 15.000</h5></figcaption></center></td>

<figcaption> <center><h4>Picudo Apanado

19.000</h5></figcaption></center></td>

<figcaption> <center><h4>Arroz con pescado

17.000</h5></figcaption></center></td>
</tr>
</table>
</div>

</center></p>
</div>
</div>
</body>
</html>
Página de pastas
Código HTML
<!DOCTYPE html>
<html>
<head>
<title>Pastas</title>
</head>
<body id="body">
<div>
<table bolder:1px>
<tr>
</tr>
</table>
</div>
<br><br>
<div id="Pastas"> <center><h1> Pastas... </h1></center>
</table>
</div>
<ul>
<li> <a href="Pescado.html"> Pescado </a> </li>
<li> <a href="Carnes.html"> Carnes </a></li>
<li> <a href="Bebidas.html"> Bebidas </a></li>
<li> <a href="Index1.html"> Página principal</a> </a>

</li>
</ul>
</div>

</h1></center>
<table id "tabla1">
<tr>

<figcaption> <center><h5>Pasta con champiñones $


<figcaption> <center><h5>pasta y carne $


<figcaption> <center><h5>Spagueti con verduras

</tr>
<tr>

<figcaption> <center><h5>Camarones con pasta

<figcaption> <center><h5>Pasta con langostinos


<figcaption> <center><h5>Macarrones con queso

$18.000</h5></figcaption></center</td></td></td>
</tr>
<br><br>
</table>
</div>

</center></p>
</div>
</div>
</body>
</html>

Actividad de Construcción Aplicada 3elsy

Hochgeladen von

Dokumentinformationen

Originaltitel

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Actividad de Construcción Aplicada 3elsy

Hochgeladen von

Copyright:

Verfügbare Formate

Actividad de construcción aplicada 3

Ingeniería de sistemas (modalidad virtual)

José Vicente Toro

Corporación Unificada Nacional (Cun)

Página principal o índex

<li> <a href="Pescado.html"> Pescado </a> </li>

<div id="galeria"> <center><h1> Algunos de los platos tipicos </h1></center>

border-radius: 0px 20px 20px 0px;

<br> <form method = "post" action = "">

<link rel="stylesheet" type="text/css" href="Index.css">

<div id="pescaderia"> <center><h1> Carnes... </h1></center>

<div id="menu" > <center><h1> Menú </h1></center>

<li> <a href="Pescado.html">Pescado </a></li>

<li> <a href="Pastas.html">Pastas </a></li>

<li> <a href="Bebidas.html">Bebidas </a></li>

<div id="galeria"> <center><h1> <p> Escoja el plato que decea degustar..</p>

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Pierna de cerdo $

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Costillas de res $

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Lomo de res

<figcaption> <center><h4>Muchacho relleno $

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Pollo asado $

<p> <center> <em> <br>« Copyright © 2020 Elsy Guerrero » </em>

border-radius: 0px 20px 20px 0px;

-webkit-transition: padding-left 0.6s ;

<link rel="stylesheet" type="text/css" href="Index.css">

<div id="Bebida"> <center><h1> Bebidas... </h1></center>

<div id="menu" > <center><h1> Menú </h1></center>

<li> <a href="Pescado.html">Pescado </a> </li>

<li> <a href="Carnes.html">Carnes </a></li>

<li><a href="Pastas.html"> Pastas </a></li>

<li> <a href="Index1.html"> Página principal </a> </li>

<div id="galeria"> <center><h1> <p> Escoja la bebida que decea degustar..</p>

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Refresco de fresa

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Té helado $6.000</h5></figcaption></center</td>

<figcaption> <center><h4>Limonada de piña

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Salpicon $9.000</h5></figcaption></center</td>

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Refajo $3.000</h5></figcaption></center</td>

<p> <center> <em> <br>« Copyright © 2020 Elsy Guerrero » </em>

<link rel="stylesheet" type="text/css" href="Index.css">

<div id="pescaderia"> <center><h1> Pescaderia... </h1></center>

<div id="menu" > <center><h1> Menú </h1></center>

<li> <a href="Carnes.html">Carnes </a></li>

<li> <a href="Pastas.html">Pastas </a></li>

<li> <a href="Bebidas.html">Bebidas </a></li>

<li> <a href="Index1.html"> Página principal </a> </li>

<div id="galeria"> <center><h1> <p> Escoja el plato que decea degustar..</p>

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Sancocho $10.000</h5></figcaption></center></td>

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Solmon $20.000</h5></figcaption></center></td>

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo

<figcaption> <center><h4>Bagre 15.000</h5></figcaption></center></td>

<td ><img src="C:\Users\PC\Desktop\formulario avanzado\ejemplo