Vemos jerarquía HTML. Y jugamos un poco con los selectores CSS Fuente:enlace Si quieres seguir aprendiendo con nosotros, puedes ingresar a nuestros Cursos y Diplomados de Tecnología Web visita www.uneweb.edu.ve para más información
Leer másResponsive Web Design son muchas cosas, esoptimización para tres elementos fundamentales, navegadores y sistemas operativos, velocidades y anchuras de pantalla. En este caso vamos a tratar sobre la optimización para pantallas, los tipos de pantallas y los saltos que el diseño debe pegar para ir adaptándose. Observarás que un diseño adaptable es responsivo a los cambios de la ventana del navegador. A medida que la hacemos mayor o menor la plantilla de la página va cambiando para adaptarse mejor a las nuevas dimensiones. Al estirar la pantalla observarás que, de…
Leer másLas Media Queries son, en una traducción rápida, consultas de las características del medio donde se está visualizando una web y nos sirven para definir estilos condicionales, que solo se aplicarán en caso que esa consulta del medio sea satisfactoria. Son una de las herramientas fundamentales para implementar el «Responsive Web Design» y han llegado de la mano de las CSS3, convirtiéndose en un aliado fundamental de cualquier diseñador web. En la mayoría de los casos las Media Queries sirven para definir estilos diferentes para distintos tamaños de la pantalla.…
Leer másEn el Manual de Responsive hemos conocido muchas características deseables de los sitios de Internet de hoy en general y de los sitios adaptables en particular. Ahora vamos a comenzar con una aproximación al flujo de trabajo que se podría realizar para la creación de un «layout responsive». Claro que hay muchas técnicas que deberemos conocer para poder producirlos, ya en código, pero no nos vamos a meter todavía con explicaciones demasiado técnicas, sino a estudiar los posibles procesos de diseño. Con el término «proceso de diseño» de momento nos referimos al…
Leer másEn líneas generales todo lo que vamos a comentar sirve también para el diseño web en general. Pues bien, cuando diseñamos una web, queremos que sea fácilmente usable y consumible y por ello debemos optimizarla en varios sentidos. El objetivo es el de siempre, que las personas aprovechen la página, tengan una experiencia de usuario grata y accedan a los contenidos que nosotros queremos. Diseño responsive no es solamente hacer que una web se adapte tanto a las pantallas de ordenadores como a las de los móviles, que también lo…
Leer másResponsive Web Design es la técnica que nos permite crear sitios adaptables a las condiciones del ordenador o dispositivo desde donde se van a acceder, sobre todo en lo que tiene relación con la pantalla del sistema donde se están visualizando. Aunque el término es suficientemente general como para poder referirse a una adaptabilidad en torno a cualquier condición. En este artículo vamos a intentar aclarar el término para que los lectores sepan bien a qué nos referimos. Antes de pensar en la web, podemos entender el término «responsive» en…
Leer másLos elementos se pueden hacer flotar a la derecha o a la izquierda usando la propiedad float. Es decir, que la caja con su contenido flota bien a la derecha o la izquierda de un documento (o de la caja contenedora) [véase la lección 9 que describe el modelo de caja]. La siguiente imagen muestra este principio: Por ejemplo, si quisiéramos texto con ajuste de línea alrededor de una imagen, el resultado sería el siguiente: ¿Cómo se hace? El código HTML del ejemplo anterior es el siguiente: <div id=»picture»> <img src=»bill.jpg» alt=»Bill Gates»>…
Leer másYa puedes aplicar lo que aprendiste en las lecciones anteriores a los enlaces (es decir, cambiar colores, fuentes, subrayado, etc.). La novedad respecto a los enlaces es que CSS te permite definir estas propiedades de forma diferente dependiendo del estado del mismo, es decir, si el enlace se ha visitado, no se ha visitado, si es el enlace activo o si el cursor está sobre dicho enlace. Esto permite añadir efectos divertidos y útiles a tu sitio web. Para controlar estos efectos se usan lo que se ha denominado como…
Leer másEn esta lección aprenderás nociones sobre fuentes y cómo se aplican usando CSS. También veremos cómo solucionar el tema de que las fuentes específicas elegidas para un sitio web sólo se pueden ver si están instaladas en el PC desde el que se accede a dicho sitio web. Se describirán las siguientes propiedades CSS: font-family font-style font-variant font-weight font-size font Familia de fuentes [font-family] La propiedad font-family se usa para establecer una lista ordenada de fuentes que se usarán para mostrar un elemento determinado o una página web. Si la primera fuente…
Leer másEn esta lección aprenderás a aplicar colores y colores de fondo a tus sitios web. Examinaremos también métodos avanzados para posicionar y controlar imágenes de fondo. Se explicarán las siguientes propiedades CSS: color background-color background-image background-repeat background-attachment background-position background Color de primer plano: la propiedad ‘color’ La propiedad color describe el color de primer plano de un elemento. Por ejemplo, imagina que queremos que todos los títulos de un documento aparezcan con color rojo oscuro. Todos los títulos están marcados con el elemento <h1>. El código siguiente establece el color de los elementos <h1> como…
Leer más