Autor Tema: Ejemplo estilos internos y externos en archivo independiente CU01010D  (Leído 2312 veces)

Tony Alcala

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 2
    • Ver Perfil
Enunciado ejercicio 1:

Citar
EJERCICIO 1

Modifica el código HTML del ejercicio para cumplir con estos requisitos mediante la aplicación de estilos internos:

a) Todas las etiquetas h1 deben mostrar su texto en color rojo.
b) Todas las etiquetas h3 deben mostrar su texto en color verde.
c) Todos los párrafos deben mostrar su texto en color brown (marrón).

Enunciado ejercicio 2:

Citar
EJERCICIO 2

Modifica el código HTML del ejercicio anterior para cumplir con estos requisitos mediante la aplicación de CSS externo definido en un archivo independiente, donde debes incluir al menos un comentario:

a) Todas las etiquetas h1 deben mostrar su texto en color azul.
b) Todas las etiquetas h3 deben mostrar su texto en color orange (naranja).
c) Todos los párrafos deben mostrar su texto en color brown (marrón).


Código html:

Código: [Seleccionar]
<html>
<head>
<meta charset="utf-8">
<title> EJERCICIO CU01010-1 </title>
<link rel="stylesheet" type="text/css" href="estilos.css">
</head>
</body>
<p><a href="principal.html" title="Pagina Principal">Ir a pagina principal</a></p>
<h1>Novedades</h1>
<p>Aqui presentamos las novedades del sitio</p>
<h3>Lanzamos el producto</h3>
<p>Este producto permite estirar la piel hasta dejarla como la de un  bebe.</p>
<p><img src="//i.imgur.com/tq5Bs.png"title="Imagen del producto" alt="imagen producto x-fashion"/></p>
<h3>Mejoramos el producto T-MOTION</h3>
<p>Hemos lanzado una nueva version del procuto T-MOTION</p>
<p><img src="http://i.imgur.com/SpZyc.png" title="Imagen del producto tmotion"alt="imagen producto tmotion"/></p>
</body>
</html>

Código CSS:

Código: [Seleccionar]
/*probando CCS externo*/
h1{color:blue;}
h3{color:orange;}
p{color:brown;}
« Última modificación: 25 de Mayo 2015, 20:08 por Mario R. Rancel »

Mario R. Rancel

  • Administrador
  • Experto
  • ********
  • APR2.COM
  • Mensajes: 1978
    • Ver Perfil
Re:Ejemplo estilos internos y externos en archivo independiente CU01010D
« Respuesta #1 en: 25 de Mayo 2015, 20:11 »
Saludos Tony, cuando escribas en el foro la solución de un ejercicio añader el código del ejercicio en el título, por ejemplo CU01010D. También recomendamos presentar los ejercicios en orden, es decir, en este caso en primer lugar la solución al ejercicio 1 y luego la solución al ejercicio 2.

Tu código para el ejercicio 2 está bien.

El ejercicio 1 quedaría así:

Código: [Seleccionar]
<html>
<head>
<meta charset="utf-8">
<title> EJERCICIO CU01010-1 </title>
<style type = "text/css">
h1{color:blue;}
h3{color:orange;}
p{color:brown;}
</style>
</head>
</body>
<p><a href="principal.html" title="Pagina Principal">Ir a pagina principal</a></p>
<h1>Novedades</h1>
<p>Aqui presentamos las novedades del sitio</p>
<h3>Lanzamos el producto</h3>
<p>Este producto permite estirar la piel hasta dejarla como la de un  bebe.</p>
<p><img src="//i.imgur.com/tq5Bs.png"title="Imagen del producto" alt="imagen producto x-fashion"/></p>
<h3>Mejoramos el producto T-MOTION</h3>
<p>Hemos lanzado una nueva version del procuto T-MOTION</p>
<p><img src="http://i.imgur.com/SpZyc.png" title="Imagen del producto tmotion"alt="imagen producto tmotion"/></p>
</body>
</html>

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".