« anterior próximo »
Páginas: [1]

Autor Tema: CSS. Tipos de bordes border-style hidden, solid... Efectos 3D div texto CU01025D  (Leído 3195 veces)

KOFFERO

  • Principiante
  • **
  • Mensajes: 78
    • Ver Perfil
CSS. Tipos de bordes border-style hidden, solid... Efectos 3D div texto CU01025D
« en: 08 de Noviembre 2017, 06:21 »
Ejercicio CU01025D del tutorial de programación CSS desde cero:

Enunciado:
Citar
EJERCICIO

Crea un documento HTML con 10 divisiones, cada una separada de la anterior por dos elementos <br/>. En cada división introduce un texto (p.ej. div 1, div 2, div 3…) y aplícale un estilo de borde diferente utilizando la propiedad border-style.
 

Código HTML:
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<title>Ejercicio CU01025D</title>
<link rel="stylesheet" type="text/css" href="estilos.css" />
</head>
<body>
   <div id="div1">Div 1</div><br/><br/>
   <div id="div2">Div 2</div><br/><br/>
   <div id="div3">Div 3</div><br/><br/>
   <div id="div4">Div 4</div><br/><br/>
   <div id="div5">Div 5</div><br/><br/>
   <div id="div6">Div 6</div><br/><br/>
   <div id="div7">Div 7</div><br/><br/>
   <div id="div8">Div 8</div><br/><br/>
   <div id="div9">Div 9</div><br/><br/>
   <div id="div10">Div 10</div><br/><br/>
</body>
</html>
Código CSS:
Código: [Seleccionar]
div {
        font-size:36px;
width: 50%;
margin: 0 auto;
text-align: center;
background-color: #4CC1DE;
}
#div1 {
border-style: solid; border-width: 3px;
}
#div2 {
border-style: inset; border-width: 3px;
}
#div3 {
border-style: outset; border-width: 3px;
}
#div4 {
border-style: dashed; border-width: 3px;
}
#div5 {
border-style: dotted; border-width: 3px;
}
#div6 {
border-style: double; border-width: 3px;
}
#div7 {
border-style: groove; border-width: 3px;
}
#div8 {
border-style: ridge; border-width: 3px;
}
#div9 {
border-style: none; border-width: 4px;
}
#div10 {
border-style: hidden; border-width: 4px;
}
Un saludo. ;) ;) ;) ;)
« Última modificación: 30 de Enero 2018, 18:06 por Alex Rodríguez »
En línea
¡Me encanta aprender!

Alex Rodríguez

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2050
    • Ver Perfil
Re:CSS. Tipos de bordes border-style hidden, solid... Efectos 3D div texto CU01025D
« Respuesta #1 en: 30 de Enero 2018, 18:06 »
Hola Jorge,,, ejercicio correcto.

Saludos
En línea
Páginas: [1]
« anterior próximo »
 

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".