Cómo aplicar CSS

Con CSS podemos dar el aspecto visual a nuestras páginas web, veamos cómo podemos aplicarlo: Insertado directamente en el HTML Podemos aplicarlo directamente dentro de las etiquetas HTML, ésta sería la forma más rudimentaria, un ejemplo dentro de una etiqueta div: Como se puede apreciar metemos la palabra «style» seguida de un «=» y luego …

Leer más

13. Multi-Columns y diseño para móviles con CSS3

Videotutorial Nº 12 del Curso de CSS3 en el que trabajamos con la propiedad multi-column y usamos media queries para crear diseños para dispositivos móviles. Con este videotutorial completamos la web que readapta su diseño dependiendo de los píxeles que tenga la ventana del navegador o la pantalla del dispositivo móvil. Temática: Programación Nivel: Avanzado

12. Diseñar sin floats ni posicionamientos en CSS3

Videotutorial Nº 13 y último del Curso de CSS3, que dedicamos a los módulos CSS3 que permiten crear diseños web. El Modelo Flexible Box Layout; Crear diseños multi-columna sin floats ni posicionamientos; Hacer que los bloques sean flexibles; Añadir columnas; Reordenar columnas; Centrar vertical y horizontalmente elementos de la página; La propiedad box-sizing; Los Módulos …

Leer más

11. Uso de Media Queries en CSS3

Videotutorial Nº 11 del Curso de CSS3 en el que vemos los Media Queries. Diferente tamaño de pantalla, diferente diseño; Diseño de partida; ¿Qué son Media Queries?; Cambiar el diseño para grandes pantallas; Fundametales de las Media Queries; Modificación navegación de horizontal a vertical. Temática: Programación Nivel: Avanzado

10. Transiciones y animaciones en CSS3

Videotutorial nº 10 del Curso de CSS3 en el que vemos como crear animaciones y transiciones con puro CSS. Hacer Fade in con transiciones; ¿A qué se puede aplicar transiciones? Hacer fade out con el uso de animaciones; ejemplos prácticos del uso de transiciones y animaciones Temática: Programación Nivel: Avanzado

09. Practicando con Pseudo-Clases en CSS3

Videotutorial Número 9 del Curso de CSS3 en el que llevamos a cabo distintas prácticas con el uso de pseudo-clases. Dar rotación aleatoria a las fotos del proyecto; El uso de nht-of-type; Destacar de modo dinámico secciones de una página; La pseudo-clase :target; Crear iconos sólo con CSS; Uso de Counters CSS; Cambiar el color …

Leer más

08. Pseudo-clases y Pseudo-elementos en CSS3

VideoTutorial Nº8 del Curso de CSS3. Vemos como apuntar a elementos específicos del documento sin usar IDs o Clases mediante el uso de Pseudo-clases y pseudo-elementos. Pseudo-clases estructurales en CSS3; El uso de nth-child( ); El DOM(Document Object Model); Ejemplo práctico: Aplicar a los comentarios estilos diferentes. Temática: Programación Nivel: Medio

07. Selectores de atributos en CSS3

Siguiendo con el Curso de CSS3 vemos los selectores de atributos, tanto de CSS 2.1 como de CSS3. Vemos ejemplos prácticos de su uso, añadiendo iconos automáticamente a las descargas por tipo, y aplicamos distintos estilos a las imágenes según la carpeta en la que se encuentren. Temática: Programación Nivel: Medio

06. Usar gráficos en bordes y en fuentes con CSS3

En éste vídeo se muestra como usar la propiedad border-size para añadir una imagen en el borde. Usamos también background-clip para impedir que las imágenes de fondo aparezcan en el borde y le aplicamos una sombra al div con box-shadow. En la última parte del Videotutorial vemos en profundidad la regla @font-face, viendo como podemos …

Leer más

05. Tratamiento de imágenes con CSS3

Quinta entrega del curso de CSS3 en el que con un ejemplo práctico veremos el manejo y tratamiento de imágenes. También se verá como usar fuentes de texto únicas sin necesidad de que estén instaladas en el ordenador del usuario… Para tal efecto, Jesús Conde nos va a mostrar en el videotutorial siguiente como crear …

Leer más