diff --git b/ejercicio2.css a/ejercicio2.css new file mode 100644 index 0000000..0e70072 --- /dev/null +++ a/ejercicio2.css @@ -0,0 +1,12 @@ +a:link{ + color: #CC0000; + margin: 20px; + display: block;; +} +a:hover{ + background: #CC0000; + color: #FFF; +} +a:visited{ + color: #CCC; +} \ No newline at end of file diff --git b/ejercicio2.html a/ejercicio2.html new file mode 100644 index 0000000..f310492 --- /dev/null +++ a/ejercicio2.html @@ -0,0 +1,17 @@ + + + + + ejercicio 2 + + +

Ejemplo numero 1

+

Ejemplo numero 2

+

Ejemplo numero 3

+

Ejemplo numero 4

+

Ejemplo numero 5

+ + + + \ No newline at end of file diff --git b/ejercicio3.css a/ejercicio3.css new file mode 100644 index 0000000..c408caa --- /dev/null +++ a/ejercicio3.css @@ -0,0 +1,40 @@ +#imagen{ + float: left; + margin-right: 1em; + +} +#imagen1{ + float: left; + margin-right: 1em; +} +#imagen2{ + margin-bottom: 1em; + margin-right: 1em; + +} +#imagen3{ + float: left; + margin-right: 1em; + margin-top: 1em; +} +#imagen4{ + float: left; + margin-right: 1em; + margin-top: 1em; +} +#imagen5{ + margin-top: 1em; +} +#imagen6{ + float: left; + margin-right: 1em; + margin-top: 1em; +} +#imagen7{ + float: left; + margin-right: 1em; + margin-top: 1em; +} +#imagen8{ + margin-top: 1em; + padding-bottom: 0; diff --git b/ejercicio3.html a/ejercicio3.html new file mode 100644 index 0000000..655aa75 --- /dev/null +++ a/ejercicio3.html @@ -0,0 +1,50 @@ + + + + ejercicio 3 + + galeria + + +
+
+
+ +
+
+ +
+
+ +
+ +
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+ +
+
+ +
+
+ + +
+ + + \ No newline at end of file diff --git b/estilos.css a/estilos.css new file mode 100644 index 0000000..3dfd860 --- /dev/null +++ a/estilos.css @@ -0,0 +1,91 @@ +/*Página original + +-El elemento #cabecera debe tener un relleno de 1em en todos los lados. +-El elemento #menu debe tener un relleno de 0.5em en todos los lados y un margen inferior de 0.5em. +-El resto de elementos (#noticias, #publicidad, #principal, #secundario) deben tener 0.5em de relleno en todos sus lados, salvo +el elemento #pie, que sólo debe tener relleno en la zona superior e inferior. +-Los elementos .articulo deben mostrar una separación entre ellos de 1em. +-Las imágenes de los artículos muestran un margen de 0.5em en todos sus lados. +-El elemento #publicidad está separado 1em de su elemento superior. +-El elemento #pie debe tener un margen superior de 1em.*/ + +#cabecera{ + padding: 1em; + border: 2px solid; + display: block; + margin-bottom: .5em; + +} + +#menu_principal{ + list-style: none; + +} +#menu_principal { + + list-style: none; + position:relative; + left:30px; + top:-1px; + text-align: left; + +} + +#buscador{ + top: 20px; + right: 10px; + float:right; + position: absolute; +} + +#menu{ + padding: :.5em; + margin-bottom: .5em; + border: 1px solid; + + +} +#lateral{ + float: left; + border: 1px solid; + width: 300px; + margin-right:2%; +} + +#noticias,publicidad{ + padding: .5em; + +} + +#principal{ + padding: .5em; + border: 1px solid; + width: 657px; + float: left; +} + +#secundario{ + padding: .5em; + border: 1px solid; + width: 200px; + float: right; + +} + +.articulo{ + margin:1em; +} + +#pie { + border: 1px solid; + padding-bottom: 0; + width: 690px; + position: relative; + float: left; + margin: 3em; +} + +.copyright{ + + float: right; +} \ No newline at end of file diff --git b/imagen.png a/imagen.png new file mode 100644 index 0000000..280ed6e Binary files /dev/null and a/imagen.png differ diff --git b/index.html a/index.html new file mode 100644 index 0000000..5217f45 --- /dev/null +++ a/index.html @@ -0,0 +1,146 @@ + + + + + + + + Lorem ipsum + + + + +
+ + +
+ + +
+
+ Buscar   +
+
+ +
+
+ + + + + + + +
+ + + + + + +
+

Publicidad

+

Etiam fermentum, nisl tincidunt blandit interdum, massa velit posuere dolor, sed euismod sem odio at mi.

+

Duis porta placerat arcu. Nullam felis pede, commodo vel, suscipit a, molestie vel, felis. Maecenas mattis est vel est.

+

Seguir leyendo...

+
+ + +
+ + +
+ + +
+ +
+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit

+ + Imagen gen�rica + +

Nullam est lacus, suscipit ut, dapibus quis, condimentum ac, risus. Vivamus vestibulum, ipsum sollicitudin faucibus pharetra, dolor metus fringilla dui, vel aliquet pede diam tempor tortor.

+

Vestibulum pulvinar urna et quam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vel turpis vitae dui imperdiet laoreet. Quisque eget ipsum.

+

Donec commodo, turpis vel venenatis sollicitudin, quam ante convallis justo, sed eleifend justo lectus quis sapien. Ut consequat libero eget est.

+

Seguir leyendo...

+
+ +
+

Vivamus lobortis turpis ac ante fringilla faucibus

+ + Imagen gen�rica + +

Quisque eget ipsum. Donec commodo, turpis vel venenatis sollicitudin, quam ante convallis justo, sed eleifend justo lectus quis sapien. Ut consequat libero eget est.

+

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam dictum hendrerit neque. Mauris id ligula non elit mattis semper. Fusce arcu ipsum, tempus eget, tincidunt at, imperdiet in, mi.

+

Sed fermentum cursus dolor. Aenean a diam. Phasellus feugiat. Donec tempor dignissim sem.

+

Seguir leyendo...

+
+ +
+ + + +
+

Phasellus blandit

+

Praesent sodales imperdiet augue. Mauris lorem felis, semper eu, tincidunt eu, sollicitudin eget, sem. Nulla facilisi. Morbi ut enim ut enim ultricies dapibus.

+

Seguir leyendo...

+ +

Nullam vel turpis

+

Donec commodo, turpis vel venenatis sollicitudin, quam ante convallis justo, sed eleifend justo lectus quis sapien. Ut consequat libero eget est.

+

Seguir leyendo...

+
+ + +
+ + +
+ + +
+ + Nulla | + Pharetra | + Luctus | + Ipsum | + Proin | + Placerat + + + + © Copyright Lorem ipsum + +
+
+ + +
+ + + + \ No newline at end of file diff --git b/index2.html a/index2.html new file mode 100644 index 0000000..86c9959 --- /dev/null +++ a/index2.html @@ -0,0 +1,147 @@ + + + + + + + + Lorem ipsum + + + + +
+ + +
+ + +
+
+ Buscar   +
+
+ +
+
+ + + + + + + +
+ + + + + + +
+

Publicidad

+

Etiam fermentum, nisl tincidunt blandit interdum, massa velit posuere dolor, sed euismod sem odio at mi.

+

Duis porta placerat arcu. Nullam felis pede, commodo vel, suscipit a, molestie vel, felis. Maecenas mattis est vel est.

+

Seguir leyendo...

+
+ + +
+ + +
+ + +
+ +
+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit

+ + Imagen generica + +

Nullam est lacus, suscipit ut, dapibus quis, condimentum ac, risus. Vivamus vestibulum, ipsum sollicitudin faucibus pharetra, dolor metus fringilla dui, vel aliquet pede diam tempor tortor.

+

Vestibulum pulvinar urna et quam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vel turpis vitae dui imperdiet laoreet. Quisque eget ipsum.

+

Donec commodo, turpis vel venenatis sollicitudin, quam ante convallis justo, sed eleifend justo lectus quis sapien. Ut consequat libero eget est.

+

Seguir leyendo...

+
+ +
+

Vivamus lobortis turpis ac ante fringilla faucibus

+ + Imagen generica + +

Quisque eget ipsum. Donec commodo, turpis vel venenatis sollicitudin, quam ante convallis justo, sed eleifend justo lectus quis sapien. Ut consequat libero eget est.

+

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam dictum hendrerit neque. Mauris id ligula non elit mattis semper. Fusce arcu ipsum, tempus eget, tincidunt at, imperdiet in, mi.

+

Sed fermentum cursus dolor. Aenean a diam. Phasellus feugiat. Donec tempor dignissim sem.

+

Seguir leyendo...

+
+ +
+ + + +
+

Phasellus blandit

+

Praesent sodales imperdiet augue. Mauris lorem felis, semper eu, tincidunt eu, sollicitudin eget, sem. Nulla facilisi. Morbi ut enim ut enim ultricies dapibus.

+

Seguir leyendo...

+ +

Nullam vel turpis

+

Donec commodo, turpis vel venenatis sollicitudin, quam ante convallis justo, sed eleifend justo lectus quis sapien. Ut consequat libero eget est.

+

Seguir leyendo...

+
+ + +
+ + +
+ + +
+ + +
+ + Nulla | + Pharetra | + Luctus | + Ipsum | + Proin | + Placerat + + + + © Copyright Lorem ipsum + +
+
+ + + + + \ No newline at end of file