Gnome Do, un Lanzador de Aplicaciones inteligente – Geeks & Linux Atelier!
6. Box-sizing, al viejo estilo
El estándar de box model del W3C se ha convertido ahora en una propiedad de un elemento, gracias al comando de CSS3: box-sizing: content-box.
Veamos un ejemplo:
#box6 {
width: 200px;
padding: 10px;
/* para Mozilla Firefox */
-moz-box-sizing: content-box;
/* para IE8 */
box-sizing: content-box;
/* para Safari & Google Chrome */
-webkit-box-sizing: content-box;
}
El comando box-sizing también acepta border-box que hace que el padding se enmarque dentro de la caja y no sumándolo a las dimensiones de ésta, tal como hacía en su día Internet Explorer 5. Un ejemplo de uso con padding y border-box sería el siguiente:
#box6b {
width: 200px;
padding: 10px;
/* for Mozilla Firefox */
-moz-box-sizing: border-box;
/*for IE8 */
box-sizing: border-box;
/* for Safari & Google Chrome */
-webkit-box-sizing: border-box;
}
7. Contorno
Además de la propiedad border, CSS3 incluye outine que es básicamente lo mismo pero que se puede aplicar a la vez, con una propiedad de offset que nos asegura un visualizado correcto de los dos de forma simultánea:
#box7 { border: 1px solid #000; outline: 1px solid #699; outline-offset: -9px; }
Si hace ya tiempo Google anunció a través del blog oficial de Gmail que incorporaba vídeochat en su plataforma para sistemas Windows, una misma nota en ese mismo blog nos avisa hoy de que por fin, también es compatible con sistemas Linux.
Ya nos contaréis vuestras experiencias con la nueva posibilidad, en cuestiones de compatibilidad con distintas distribuciones y navegadores.
Ya hablamos en su día de AppWhirl, un sistema para crear aplicaciones para iPhone desde la Web. Hoy os presento una novedad del gran equipo de Google, y es que se trata de un creador de aplicaciones (sin código), al más puro estilo Yahoo Pipes para programar aplicaciones para nuestro dispositivo Android.
La idea es poder conectar bloques para poder crear funciones más complejas. App Inventor trata de ser una herramienta para que cualquiera, sin necesidad de tener grandes conocimiento de programación, pueda programar aplicaciones para Android. Sin duda, os recomiendo probarlo y ya nos comentarios que os parece esta interesante novedad.
Que la quinta versión de HTML sea una novedad y que últimamente existan cientos de noticias al respecto es evidente, nos enfrentamos a una tecnología que actualmente es desconocida por muchos, no tanto en uso si no en desarrollo.
De hecho, esta no es la primera vez que hablamos sobre HTML5 en Linux Hispano, lo hemos hecho en multitud de ocasiones, os recomiendo daros una vuelta sobre nuestras entradas más populares al respecto:
Y en otra ocasión Nacho López ya comentó acerca de juegos arcade (los de toda la vida) desarrollados con JavaScript sobre HTML5. Pero ahora os presento un directorio bastante completo de juegos desarrollados en HTML5, divididos en diversas categorías y con un sistema de valoraciones, echad un vistazo por HTML5games y ya nos contaréis que os parece.
Traducción del original Top 10 CSS3 commands de Webcredible.
1. Bordes radiales
Hasta la aparición de CSS3 para crear esquinas curvadas, teníamos que remitirnos al truco de las cuatro imágenes, cada una para cada esquina. Con CSS3 es tan simple como lo siguiente:
box1 {
border: 1px solid #699;
/* para Mozilla Firefox */
-moz-border-radius: 20px;
/* para Safari & Google Chrome */
-webkit-border-radius: 20px;
}
2. Sombra cuadrada
Una sombra puede ser aplicada a los elementos cuadrados utilizando una sola instrucción. Se necesitan tres números para definir cómo será:
Este comando no se visualiza, todavía, en Internet Explorer.
#box2 {
/* para Mozilla Firefox */
-moz-box-shadow: 5px 5px 5px #b6ebf7;
/* para Safari & Google Chrome */
-webkit-box-shadow: 5x 5px 5px #b6ebf7;
}
3. Transparencia o RGBA
Los niveles de transparencia siempre han sido un problema para los navegadores, algunos directamente no los aplicaban y los demás los mostraban de una forma diferente para un mismo valor. Para solucionarlo, CSS3 plantea un nuevo estándar basado en tres números del 0 al 255, los RGB de siempre; y un cuarto, cuyo dominio abarca del 0 al 1 y que indica el canal alfa, es decir, la transparencia.
Por ejemplo:
#box3 {
background-color: rgba(110, 142, 185, .5);
}
Sin embargo, Internet Explorer no entenderá el comando y deberemos duplicar la instrucción para una óptima visualización en diferentes navegadores. El pseudo-selector :last-child hará que Internet Explorer obvie la segunda instrucción.
#box3 { /* Para Internet Explorer */ background-color: #6e8eb9; } body:last-child #box3 { /* Para el resto de navegadores */ background-color: rgba(110, 142, 185, .5)!important; }
Os traemos una nueva revista que he encontrado leyendo Ubuntu Life. No es la primera revista que difundimos por Linux Hispano, pero espero que sea de vuestro interés, más aún a los que todavía disfrutáis de vacaciones.
La revista en cuestión Planetix, un proyecto peruano bastante joven pero que está teniendo muy buena aceptación entre la comunidad libre. Ahora mismo acaban de lanzar el número 4 en el que hablan de temas como:
Entre otros. Aquí tenéis el enlace para descargarla directamente en PDF.
Revista digital “Python entre todos” – Barrapunto
