diff --git a/1-the-basics/basics.html b/1-the-basics/basics.html new file mode 100644 index 0000000..5485a8a --- /dev/null +++ b/1-the-basics/basics.html @@ -0,0 +1,14 @@ + + + + + + + Mayra Vargas + + + +

Mayra Vargas

+ + + \ No newline at end of file diff --git a/2-other-html-tags/img/correo.png b/2-other-html-tags/img/correo.png new file mode 100644 index 0000000..7f2cea4 Binary files /dev/null and b/2-other-html-tags/img/correo.png differ diff --git a/2-other-html-tags/img/foto-hoja-vida.jpg b/2-other-html-tags/img/foto-hoja-vida.jpg new file mode 100644 index 0000000..57d8132 Binary files /dev/null and b/2-other-html-tags/img/foto-hoja-vida.jpg differ diff --git a/2-other-html-tags/img/mapa.png b/2-other-html-tags/img/mapa.png new file mode 100644 index 0000000..b039513 Binary files /dev/null and b/2-other-html-tags/img/mapa.png differ diff --git a/2-other-html-tags/img/telefono.png b/2-other-html-tags/img/telefono.png new file mode 100644 index 0000000..d23e7cd Binary files /dev/null and b/2-other-html-tags/img/telefono.png differ diff --git a/2-other-html-tags/index.html b/2-other-html-tags/index.html new file mode 100644 index 0000000..4418757 --- /dev/null +++ b/2-other-html-tags/index.html @@ -0,0 +1,76 @@ + + + + + + + My resume + + + + +
+

Mayra Vargas

+ My photo + +
+
+
+ Ubicación +

Duitama, Boyacá

+
+ Correo + vargasmayra800@gmail.com +
+
+ Telefono +

3138661775

+
+
+

Habilidades

+
+

Soy una persona positiva y optimista, dispuesta al + aprendizaje y la superación personal, con sentido de + pertenencia. Responsable, amable, me gusta ser + colaboradora y sobretodo conservar un ambiente laboral + agradable con buena disposición.

+ Cuento con excelentes relaciones interpersonales y + facilidad para trabajar en grupo, responsable, atenta, + respetuosa y dedicada a mis ocupaciones diarias

+
+

Lugares

+
+
+

Paipa - Boyacá Lago Sochagota

+

Melgar - Tolima Piscilago

+

Yopal - Casanare Yopal

+
+ +
+

Experiencia Profesional

+
+ +

REEDSO,
+ Administradora de contenido + Tareas realizadas: Manejo y publicación del + Contenido en redes sociales, administración de catálogos + virtuales en prestashop, publicación de contenido en + plataformas wordpress, maquetación de mails y landings + pequeños para campañas.

+ + Disarq Constructora,
+ Community manager + Tareas realizadas: Manejas y publicación del + Contenido en redes sociale

+ + Igloolab
+ Administracion de contenido, maquetacion de emails + y landings +

+
+ + +
+ + + \ No newline at end of file diff --git a/2-other-html-tags/style.css b/2-other-html-tags/style.css new file mode 100644 index 0000000..be25779 --- /dev/null +++ b/2-other-html-tags/style.css @@ -0,0 +1,176 @@ +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} + + +body{ + font-family: Arial, Helvetica, sans-serif; + max-width: 1200px; + width: 100%; + margin: auto; + display: block; +} +.contenido{ + display: flex; + flex-direction: row; + justify-content: space-around; + margin: auto 0; + background-color: #492f55; + width: 100%; + height: 100%; + padding: 18px; + +} +.contenido p{ + + max-width: 340px; + font-size: 51px; + color: white; + font-weight: bold; + font-family: Arial, Helvetica, sans-serif; + margin-right: 30px; + text-align: center; +} + +.contenido img{ + + max-width: 230px; + border-radius: 30px; + border: 10px solid white; + margin-bottom: 25px; +} + +.contenido-dos{ + background-color: #492f55; + width: 100%; + margin: 0; + display: block; + padding: 18px; +} +.descripcion{ + background-color: white; + border-radius: 15px; + width: 84%; + margin: auto; + display: block; + +} +.mapa{ + width: 28px; + display: inline-block; +} +.ciudad{ + display: inline-block; + +} +.correo{ + width: 28px; +} +.direcc-correo{ + list-style: none; + text-decoration: none; + color: black; +} +.telefono img{ + width: 28px; + display: inline-block; +} +.telefono p{ + display: inline-block; +} + +.administradora{ + background-color: #ac5cb6; + max-width: 312px; + height: 38px; +} +.administradora p{ + font-size: 25px; + color: white; + padding: 5px; + text-align: center; + +} + +.valores{ + font-size: 21px; + padding: 20px; +} + +.lugares{ + background-color: #263427; + max-width: 312px; +} +.lugares{ + font-size: 25px; + color: white; + height: 38px; + text-align: center; +} + +.sitios{ + padding: 30px; +} +.sitios p{ + font-size: 21px; +} +.experiencia{ + background-color: #e4ae3a; + max-width: 312px; + height: 38px; +} +.experiencia p{ + font-size: 21px; + text-align: center; + padding: 7px; + color: white; +} +.trabajos span{ + font-weight: bold; + font-size: 21px; +} +.trabajos { + font-size: 21px; + padding: 18px; +} + diff --git a/3-semantic-html/index.md b/3-semantic-html/index.md index afc257f..01279cc 100644 --- a/3-semantic-html/index.md +++ b/3-semantic-html/index.md @@ -150,3 +150,5 @@ Let's see more examples: [Semantic structure](https://www.internetingishard.com/ * [Semantic structure](https://www.internetingishard.com/html-and-css/semantic-html/) * [Why use semantic HTML](https://www.lifewire.com/why-use-semantic-html-3468271) * [Element list](https://developer.mozilla.org/es/docs/HTML/HTML5/HTML5_lista_elementos) + +