diff --git a/Practicas/Practicas HTML/Repaso 2/Repaso2.jpg b/Practicas/Practicas HTML/Repaso 2/Repaso2.jpg new file mode 100644 index 0000000..d75e73f Binary files /dev/null and b/Practicas/Practicas HTML/Repaso 2/Repaso2.jpg differ diff --git a/Practicas/Practicas HTML/Repaso 2/css/style.css b/Practicas/Practicas HTML/Repaso 2/css/style.css index 861648a..65f924a 100644 --- a/Practicas/Practicas HTML/Repaso 2/css/style.css +++ b/Practicas/Practicas HTML/Repaso 2/css/style.css @@ -55,7 +55,8 @@ body { } #inicio, -#equipo { +#equipo, +#contacto { scroll-margin-top: 150px; } @@ -68,6 +69,7 @@ main { margin-top: 3em; box-sizing: border-box; text-align: center; + font-family: Arial, Helvetica, sans-serif; } h1 { @@ -104,14 +106,14 @@ section p { } .card { - max-width: 320px; + width: 320px; padding: 0.5em; - border: 3px solid rgb(21, 92, 190); - color: rgb(21, 92, 190); + border: 4px solid #2795de; + color: #2795de; } .card > img { margin-top: 1em; - width: 80%; + max-height: 320px; } .card-details { @@ -129,7 +131,7 @@ section p { } .card-details span { - color: rgb(21, 92, 190); + color: #2795de; font-weight: bold; } @@ -163,23 +165,55 @@ footer p { height: 48px; } -.form_container { - padding: 0.5em; - box-sizing: border-box; - display: flex; - gap: 0.4em; - flex-direction: column; +.form_main { width: 100%; - border: 3px solid blue; + border: 4px solid #2795de; + color: #2795de; + box-sizing: border-box; + padding: 0.3em; + display: flex; + flex-direction: column; + gap: 0.5em; } -.form_container .subform { +.form_main > fieldset { + text-align: start; + border: 4px solid #2795de; + box-sizing: border-box; padding: 0.5em; - border: 3px solid blue; + display: flex; + flex-direction: column; + gap: 0.6em; } +label { + display: inline-block; + font-weight: bold; + width: 6em; +} +.flex_responsive { + display: flex; + flex-direction: row; + gap: 0.5em; + align-items: center; +} +input, +select, +textarea { + background-color: rgb(0, 0, 0, 0.6); + color: white; + height: 2em; + padding: 0 0.2em; + vertical-align: middle; +} + +textarea { + width: 98%; + height: 200px; + border: 2px solid white; +} /* Definiciones para el boton de subir pagina*/ #subircaja { @@ -208,10 +242,18 @@ footer p { main { width: 90%; } + .card { width: 230px; } + footer { width: 90%; } + + .flex_responsive { + display: flex; + align-items: normal; + flex-direction: column; + } } diff --git a/Practicas/Practicas HTML/Repaso 2/index.html b/Practicas/Practicas HTML/Repaso 2/index.html index d19c327..076695d 100644 --- a/Practicas/Practicas HTML/Repaso 2/index.html +++ b/Practicas/Practicas HTML/Repaso 2/index.html @@ -89,19 +89,60 @@

Contacta con nosotros

- -
+
- - +
+ + +
+
+ + +
-
- +
+
+ + +
+ +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ + +
+
+
+
-