Conceptos básicos de CSS: primeros pasos en CSS grid
Rachel Andrew, Web Developer, Speaker and Author
Ve esta clase y miles más
Ve esta clase y miles más
Lecciones en esta clase
-
-
1.
Introducción
1:23
-
2.
Introducción a CSS grid
8:17
-
3.
Definir tu cuadrícula
10:33
-
4.
Definir el tamaño del elemento para pistas
6:23
-
5.
Anidar cuadrículas y ubicar elementos
10:56
-
6.
Combinar la ubicación manual y automática
7:35
-
7.
Incorporar la adaptabilidad
9:23
-
8.
Combinar diseños
3:30
-
9.
Reflexiones finales
0:59
-
10.
Explora más clases en Skillshare
0:35
-
-
- --
- Nivel principiante
- Nivel intermedio
- Nivel avanzado
- Todos los niveles
Generado por la comunidad
El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.
5483
Estudiantes
8
Proyectos
Acerca de esta clase
¿Quieres crear diseños bidimensionales rápidos y flexibles en CSS? ¡Aprende a hacerlo con CSS grid!
Únete a la gurú web, oradora y autora Rachel Andrew en esta clase sobre CSS grid: el sistema de diseño más potente disponible en CSS. Con CSS grid, ahora puedes definir tanto las filas como las columnas y generar un sistema bidimensional que abre todo un nuevo mundo de posibilidades de diseño. A lo largo de la clase, Rachel analiza CSS grid y te muestra las poderosas estructuras responsivas y flexibles que te permite implementar en tus diseños.
Las lecciones clave incluyen:
- Cómo agregar espacios y bordes con una sola línea de código
- Cómo anidar cuadrículas para crear superposiciones fáciles
- Cómo crear imágenes destacadas combinando la ubicación manual y la automática
- Cómo incorporar la adaptabilidad para la visualización en cualquier tamaño de pantalla
Tanto si tienes conocimientos básicos como avanzados de CSS, esta clase te mostrará cómo crear diseños a gran escala, únicos y asimétricos con facilidad y eficiencia. Cada desarrollador debería conocer CSS grid y, después de esto, estarás listo para implementarlo en tu próximo proyecto.
Conoce a tu profesor(a)
Rachel Andrew lives in Bristol, England. She is one half of web development company edgeofmyseat.com, the company behind Perch CMS and Notist. Her day to day work can include anything from product development to devops to CSS, and she writes about all of these subjects on her blog at rachelandrew.co.uk.
Rachel has been working on the web since 1996 and writing about the web for almost as long. She is the author or co-author of 22 books including The New CSS Layout, and a regular contributor to a number of publications both on and offline. She is a Google Developer Expert for Web Technologies a W3C Invited Expert to the CSS Working Group, and Editor in Chief of Smashing Magazine. Rachel is a frequent speaker at web development and design events includ... Ver perfil completo
Proyecto de clase práctica
¡Sube la página de tu blog!
Nos encantaría ver tu proyecto, tanto si has usado CodePen como tu propio editor. También puedes subir cualquier fragmento de código o ideas sobre las formas en que te entusiasma empezar a usar CSS grid.
Recursos
- Para ver más recursos de Rachel Andrew sobre CSS grid: Grid by Example
- Para obtener una cuenta gratuita de CodePen: skl.sh/codepen
Enlaces de ejercicios
- Punto de partida: skl.sh/cssgrid_1
- Definir el tamaño del elemento para pistas: skl.sh/cssgrid_2
- Anidar cuadrículas y colocar elementos: skl.sh/cssgrid_3
- Combinar la ubicación manual y la automática: skl.sh/cssgrid_4
- Incorporar la adaptabilidad: skl.sh/cssgrid_5
- Combinar diseños: skl.sh/cssgrid_6
- Página final del blog: skl.sh/cssgrid_final
Encuentra a Rachel en su sitio web, Twitter y blog
Explora más clases en Skillshare
- El kit completo de herramientas de JavaScript: cómo escribir un código más limpio, más rápido y mejor - Christian Heilmann
- Introducción a CSS: agregar estilos básicos a un sitio web de portafolio - Jenn Lukas
- Diseño UX responsivo e inteligente: consejos ingeniosos, trucos y técnicas - Vitaly Friedman
- Programación de visualizaciones de datos: un conjunto de herramientas de codificación para Processing - Nicholas Felton
Valoración de la clase
¿Por qué unirse a Skillshare?
Mira las galardonadas Skillshare Originals
Cada clase tiene lecciones cortas y proyectos prácticos
Tu membresía apoya a los profesores de Skillshare
Aprende desde cualquier lugar
Ve clases sobre la marcha con la aplicación de Skillshare. Progresa en línea o descarga las clases para verlas en el avión, el metro o donde sea que aprendas mejor.
