diff --git a/1-the-basics/form.html b/1-the-basics/form.html new file mode 100644 index 0000000..738a00a --- /dev/null +++ b/1-the-basics/form.html @@ -0,0 +1,45 @@ + + + + + + + document + + + + +
+
+ Please enter your contact details + +
+ +
+ + +
+
+ Please select the courses that you are interested in (required): + +
+ +
+ +
+ +
+ +
+ Please enter a massage (optional): + +
+ + +
+ + + + \ No newline at end of file diff --git a/1-the-basics/img-form/Burbujas-de-colores_Abstract-Wallpapers.jpg b/1-the-basics/img-form/Burbujas-de-colores_Abstract-Wallpapers.jpg new file mode 100644 index 0000000..8d93d8f Binary files /dev/null and b/1-the-basics/img-form/Burbujas-de-colores_Abstract-Wallpapers.jpg differ diff --git a/1-the-basics/style.css b/1-the-basics/style.css new file mode 100644 index 0000000..b17d0c8 --- /dev/null +++ b/1-the-basics/style.css @@ -0,0 +1,30 @@ +.contenido-p{ + font-family: Arial, Helvetica, sans-serif; + font-size: 22px; + background-image: url(img-form/Burbujas-de-colores_Abstract-Wallpapers.jpg) ; + background-size: cover; + background-repeat: no-repeat; + width: 100%; + padding: 20px; + } + .btn:hover{ + background-color: #133e11; + color: #6294a6; + font-family: Arial, Helvetica, sans-serif; + + } + .btn{ + width: 138px; + height: 30px; + border-radius: 5px; + background-color: #575a57; + color: white; + font-size: 15px; + } + .footer{ + background-color: #9fa7aa; + height: 100px; + margin: 0px; + padding: 1px; + width: 100%;; + } \ No newline at end of file diff --git a/2-positioning/positioning.html b/2-positioning/positioning.html new file mode 100644 index 0000000..ff00734 --- /dev/null +++ b/2-positioning/positioning.html @@ -0,0 +1,69 @@ + + + + + + + Position + + + + +
+

This is my first layout

+
+ + + +
+

+ Lorem Ipsum is simply dummy text of the printing and typesetting + industry. Lorem Ipsum has been the industry's standard dummy text ever + since the 1500s, when an unknown printer took a galley of type and + scrambled it to make a type specimen book. It has survived not only + five centuries, but also the leap into electronic typesetting, + remaining essentially unchanged. It was popularised in the 1960s with + the release of Letraset sheets containing Lorem Ipsum passages, and + more recently with desktop publishing software like Aldus PageMaker + including versions of Lorem Ipsum. +

+
+
+

+ Lorem Ipsum is simply dummy text of the printing and typesetting + industry. Lorem Ipsum has been the industry's standard dummy text ever + since the 1500s, when an unknown printer took a galley of type and + scrambled it to make a type specimen book. It has survived not only + five centuries, but also the leap into electronic typesetting, + remaining essentially unchanged. It was popularised in the 1960s with + the release of Letraset sheets containing Lorem Ipsum passages, and + more recently with desktop publishing software like Aldus PageMaker + including versions of Lorem Ipsum. +

+
+
+

+ Lorem Ipsum is simply dummy text of the printing and typesetting + industry. Lorem Ipsum has been the industry's standard dummy text ever + since the 1500s, when an unknown printer took a galley of type and + scrambled it to make a type specimen book. It has survived not only + five centuries, but also the leap into electronic typesetting, + remaining essentially unchanged. It was popularised in the 1960s with + the release of Letraset sheets containing Lorem Ipsum passages, and + more recently with desktop publishing software like Aldus PageMaker + including versions of Lorem Ipsum. +

+
+ + + + diff --git a/2-positioning/style.css b/2-positioning/style.css new file mode 100644 index 0000000..f71b61c --- /dev/null +++ b/2-positioning/style.css @@ -0,0 +1,53 @@ +.header{ + width: 100%; + background-color: black; + color: white; + font-size: 7px; + border-width: 3px; + border-style: solid; + border-color: #2ff60b; +} + +.cont-p{ + width: 200px; + border-width: 3px; + border-style: solid; + border-color: #1031f7; + position: fixed; + top: 49px; + left: 10px; +} + +.indice{ + color: #1031f7; + text-decoration: #1031f7; + font-size: 20px; + +} + +.cont-2{ + width: 70%; + + padding-left: 227px; + margin: 0; + display: inline-block; +} + +.cont-2 p{ + border-width: 3px; + border-style: solid; + border-color: red; + margin: 0px; +} +footer{ + background-color: black; + width: 100%; + color: white; + font-size: 25px; + border-width: 3px; + border-style: solid; + border-color: #f4d944; +} + + +