From be87960502d27fc7ac6f10f9a7f2bb986743cd14 Mon Sep 17 00:00:00 2001
From: devfzn <dev_fzn@proton.me>
Date: Wed, 12 Apr 2023 18:34:50 -0400
Subject: [PATCH] HTML5 y CSS3 pt. 3: Formularios y Tablas 06

tags: table, tr, td, thead, tbody, th, tfoot. y estilos. Fin 06.
---
 004_primeras_paginas/README.md                | 10 ++++++--
 .../html_css_parte3/contacto.html             | 24 +++++++++++++++++++
 .../html_css_parte3/style.css                 | 15 ++++++++++++
 3 files changed, 47 insertions(+), 2 deletions(-)

diff --git a/004_primeras_paginas/README.md b/004_primeras_paginas/README.md
index 783893d..9db2624 100644
--- a/004_primeras_paginas/README.md
+++ b/004_primeras_paginas/README.md
@@ -294,5 +294,11 @@ p.test { color: magenta; }
 
 - Etiqueta `<fieldset>` como agrupador y `<legend>` como parrafo.
 - Descripción de imagenes `alt="Descripción de imagen"`.
-- Clase css *enviar* para input submit "Enviar Formulario" [contacto](./html_css_parte3/contacto.html#L63).
-- Propiedades: cursor (pointer), transition, transform (scale, rotate).
+- Clase css *enviar* para input submit "Enviar Formulario"
+[contacto](./html_css_parte3/contacto.html#L63).
+- [Propiedades](./html_css_parte3/style.css#L123): cursor (pointer), transition,
+transform (scale, rotate).
+- [Tablas](./html_css_parte3/contacto.html#L66) y [estilo](./html_css_parte3/style.css#L142).
+
+Final curso HTML5 y CSS parte 3
+
diff --git a/004_primeras_paginas/html_css_parte3/contacto.html b/004_primeras_paginas/html_css_parte3/contacto.html
index 4487a6f..285e276 100644
--- a/004_primeras_paginas/html_css_parte3/contacto.html
+++ b/004_primeras_paginas/html_css_parte3/contacto.html
@@ -62,6 +62,30 @@
                 </label>
                 <input type="submit" class="enviar" value="Enviar Formulario"/>
             </form>
+
+            <table>
+                <thead>
+                    <tr>
+                        <th>Días</th>
+                        <th>Horario</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>Lunes</td>
+                        <td>9h ~ 20h</td>
+                    </tr>
+                    <tr>
+                        <td>Miercoles</td>
+                        <td>9h ~ 20h</td>
+                    </tr>
+                    <tr>
+                        <td>Viernes</td>
+                        <td>9h ~ 20h</td>
+                    </tr>
+                </tbody>
+            </table>
+
         </main>
         <footer>
             <img src="./imagenes/logo-blanco.png" alt="logo Barbería Alura">
diff --git a/004_primeras_paginas/html_css_parte3/style.css b/004_primeras_paginas/html_css_parte3/style.css
index a955af8..06bc60c 100644
--- a/004_primeras_paginas/html_css_parte3/style.css
+++ b/004_primeras_paginas/html_css_parte3/style.css
@@ -139,6 +139,21 @@ form label, form legend {
     transform: scale(1.2) rotate(4deg);
 }
 
+table {
+    margin: 40px 40px;
+}
+
+thead {
+    background: #046dfc;
+    color: #f1f1f1;
+    font-weight: bold;
+}
+
+td, th {
+    border: 1px solid #046dfc;
+    padding: 8px 15px;
+}
+
 /* Usados para observar Jerarquía en CSS
 form p {
     color: blue;