Estoy intentando al estilo de los niños artículos de la siguiente maneraCSS nth-child 1-6, 7-12, etc
1,7,13, etc
2,8,14, etc
3,9,15, etc
4,10,16, etc
5,11,17, etc
6,12,18, etc
¿Qué sintaxis nth-child puedo usar para lograr esto?
Estoy intentando al estilo de los niños artículos de la siguiente maneraCSS nth-child 1-6, 7-12, etc
1,7,13, etc
2,8,14, etc
3,9,15, etc
4,10,16, etc
5,11,17, etc
6,12,18, etc
¿Qué sintaxis nth-child puedo usar para lograr esto?
Puede utilizar :nth-child(6n+1)
, :nth-child(6n+2)
, :nth-child(6n+3)
, etc .. :nth-child(6n+4)
Referencias: http://w3.org/TR/css3-selectors/#nth-child-pseudo, http://w3.org/TR/css3-selectors/#selectors (gracias @NayukiMinase)
Además, un muy buen ejemplo es aquí: Useful :nth-child Recipes - CSS-Tricks
lectura la explicación de cómo nth-child
funciona here.
puede usar 6n + x, donde debe insertar los números apropiados para x.
Utilice esta sencilla ecuación matemática: nd + a
here a : first element index n : n d : difference Example: 1,7,13,etc here a : 1 n : n d : 6 So the pseudo selector will be :nth-child(6n + 1)
Espero que esto ayudó :)
Referencias: http://www.w3.org/TR/css3- selectores/# nth-child-pseudo, http://www.w3.org/TR/css3-selectors/#selectors – Nayuki
': nth-child (6n)' para 6, 12, 18 ... – BoltClock