Actividad 11

 Una cafetería local quiere publicar su menú en su página web. Actualmente, el menú está organizado en una tabla HTML, pero los clientes se quejan de que:

• La tabla se ve desordenada
• El texto está mal alineado
• Es difícil distinguir los precios
• No hay separación clara entre los productos
• El diseño no es atractivo

El dueño te contrata como desarrollador web para mejorar la presentación usando CSS.

Situación inicial (tabla sin estilo)

<table>
  <tr><th>Producto</th><th>Precio</th><th>Descripción</th></tr>
  <tr><td>Café</td><td>$25</td><td>Caliente</td></tr>
  <tr><td>Té</td><td>$20</td><td>Natural</td></tr>
  <tr><td>Pastel</td><td>$30</td><td>Chocolate</td></tr>
</table>



Problema a resolver
Diseña los estilos CSS en un archivo externo, necesarios para que el menú cumpla con los siguientes requisitos:

1.     La tabla debe ocupar el 80% del ancho de la página 
2.     Los encabezados deben estar alineados a la izquierda 
3.    El contenido debe estar alineado en la parte superior 
4.      La tabla debe tener bordes visibles y definidos 
5.     Las celdas deben tener espacio interno (padding) para mejorar la lectura 
6.     Debe existir espaciado entre la tabla y otros elementos (margin) 
7.     Las filas deben tener colores alternados para facilitar la lectura 
8.      Los bordes deben estar unificados (border-collapse) 
9.     El título de la tabla debe mostrarse en la parte inferior (caption-side) 
10.  Las esquinas de las celdas deben ser ligeramente redondeadas