Manejando datos

Tablas con PureCSS

Posted by in Frameworks, HTML5

Última entrada que realizamos sobre PureCSS, el framework de CSS de Yahoo! que facilita la vida a los que les cuesta mucho el front-end. Hoy, toca hablar de Tablas. Para nuestro ejemplo hemos realizado el ejercicio con la misma tabla que para Twitter Bootstrap. En bruto, el resultado es este: Para aplicar estilos de PureCSS a una tabla está la clase pure-table, que automáticamente cambia al siguiente aspecto: Todavía hay más clases que se pueden utilizar. En concreto, para remarcar las líneas en horizontal (en la imagen anterior están en…read more

Botones y Formularios con PureCSS.io

Posted by in Frameworks, HTML5

En la entrada anterior hablamos de PureCSS, el framework CSS de Yahoo!, que lo considero muy interesante para los que no son fanáticos del front-end, y desean mejorar el aspecto de las aplicaciones Web. Botones Las clases aplicadas a los botones pueden ser utilizadas tanto en las etiquetas <a> como en las etiquetas <button>. En cualquier caso, se han incluido estilos adicionales en manejandodatos_purecss.css según se detallan en la documentación, y que parece que no están incluidos por defecto en PureCSS. La clase a aplicar es pure-button, a la que…read more

Menus con PureCSS

Posted by in Frameworks, HTML5

Tras una primera introducción a PureCSS en la entrada anterior, donde expuse porqué este projecto me encanta, es hora de mostrar qué se puede hacer con él. Menus La estética de los menús se basa en un conjunto de items dentro de una lista desordenada, donde el CSS se encarga de ponerlo bonito. La lista ordenada es esta: Los menus son por defecto verticales, y se ajustan al ancho del elemento DIV que los contiene. Así, con las clases pure-menu y pure-menu-open ya lo tenemos: Si queremos resaltar una de…read more

PureCSS, el framework perfecto para el back-end

Posted by in Frameworks, HTML5

Los frameworks para programación web están muy de moda. Si bien ya hemos hablado de Twitter Bootstrap, hoy toca de una alternativa a propuesta de yahoo!, que parece renacer de sus cenizas y ahora también publican algunas herramientas. PureCSS Se trata de purecss.io, que es un framework CSS para facilitar el front-end de los desarrolladores web que no quieran complicarse mucho la vida, o sea, mi caso. La base de este framework está en Normalize.css, un proyecto donde se pretende que todos los navegadores muestren exactamente lo mismo (bueno, o…read more

4

Recursos para trabajar con CSS

Posted by in HTML5

CSS no es uno de los aspectos de la programación a los que haya dedicado muchas horas. Un poco de por aquí, un poco de por allá, y unas cuantas búsquedas para salir del paso me han servido para conocer cómo es la sintáxis, aunque reconozco que no he invertido mucho tiempo. Sin embargo, para ayudarme he ido recopilando varias Web que ofrecen herramientas online, y que a continuación les comento: cssmatic es perfecta para colores, bordes, texturas y sombras. Para colores, recomiendo la extensión de Firefox llamada colorzilla. De…read more