Autor Tema: HTML y CSS. column-count, column-rule, interpretar código. Ejercicio CU01057D  (Leído 2183 veces)

Chompy129

  • Intermedio
  • ***
  • Mensajes: 130
  • Programar es divertido. :)
    • Ver Perfil
Columnas CSS: column-count, column-width, columns, colum-gap y colum-rule. Ejemplos prácticos (CU01057D)

Bueno, aquí les dejo el código de la actividad:
Código: [Seleccionar]
.cols3 {
  -webkit-column-count: 3;  -webkit-column-gap: 20px;   -webkit-column-rule: 1px solid #000;
  -moz-column-count: 3;   -moz-column-gap: 20px;  -moz-column-rule: 1px solid #000;
  column-count: 3;  column-gap: 20px;  column-rule: 1px solid #000;
 }
 
 .cols3 h1 {   -webkit-column-span:all;   -moz-column-span:all;   column-span:all;
 }

ACTIVIDAD
Explica paso a paso a qué da lugar cada instrucción o fragmento de código (ejemplo: .cols3 indica que se aplicarán los estilos definidos a todos los elementos html cuyo atributo class sea igual a cols3, -webkit-column-count: 3; se escribe para lograr que …).

 ¿Qué utilidad tiene la propiedad column-span?

R=

Antes que nada responderé para que se usa column-span. La verdad que esta propiedad no termine de entenderlo bien, pero creo que se trata de una propiedad que especifica el número de columnas de un elemento debe extenderse a lo largo.

Ahora el código:

Clase "cols3". Todo contenedor que use esta clase contara con tres columnas, separados entre 20px, y aparte los separan border de 1px, solidos y de color negro. (Las propiedades anteriormente mencionadas tienen compatibilidad con versiones anteriores de mozilla[-moz-], Chrome, Safari, Android y Ios[-webkit-] y con las versiones actuales)

Tag "cols3 h1". Todo encabezado que este dentro de un contenedor con clase "cols3" estará en todo el ancho del contenedor sin importar las columnas en medio.

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:HTML y CSS. column-count, column-rule, interpretar código. Ejercicio CU01057D
« Respuesta #1 en: 27 de Septiembre 2016, 23:49 »
Hola Chompy129.

Para ser más exactos, lo que indica es si tiene que estar dentro de la primera columna situada más a la izquierda o expandirse por todas las que tengamos.

Las demás respuestas bien.

Saludos. ;D


 

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