ARTEgami

Dale estilo a tus citas

Las comillas, mas conocidas en este mundo como “Quotes”, son necesarias a la hora de citar parte del texto de otra persona, sitio, o lo que fuere. Es una forma de destacar esas líneas, y de paso darle mas vida a un post. Muchos le dan algún toque original a las comillas, como ser configurarlas para que se vean en otros colores y tamaños. Pero en Css Newbie fueron un poco mas allá y nos muestran seis formas de destacar tus blockquotes de forma artística y original.

Aprenderemos como mostrarlos con un fondo, con un fondo y algún que otro borde, con unas comillas mas grandes, otras tipografías, etc. Si tienes ganas de que cuando cites algo de otro sitio en tu blog, esto se vea destacado y al mismo tiempo con estilo y no tan “simple”, deberías darte una vuelta, ya que se trata solo de copiar y pegar, porque nos brindan el código correspondiente a cada ejemplo mostrado.

Fuente: Knowtebook

Posted in CSS, Creatividad, Tutorial | No Comments »

Crea una galería de imágenes con CSS

En el sitio HelpDeveloper tuvieron la excelente idea de enseñarnos a crear una galería para mostrar nuestras imágenes con una descripción cada una utilizando solo el código CSS. ¿Una de las buenas cosas de utilizar CSS y no Java? no necesitas aprender JavaScript, ni encontrar un script de calidad (lo cual puede llevar horas), y tienes la seguridad de que lo puedan ver todos, incluidos aquellos que tengan JavaScript desactivado. Veremos como resultado una galería de fotos con miniaturas como adelanto en la parte izquierda del sitio, con las descripciones apareciendo en modo “hover”, o sea al posar el mouse sobre una de ellas.

Necesitaremos para empezar seis imágenes, tres miniaturas y tres en tamaño normal. Las miniaturas deberán ser del mismo tamaño que en el ejemplo (150×100), y sería útil que las grandes también estén en 400×300. Por supuesto esto es fácil de cambiar gracias a las propiedades del CSS, junto con el resto del sitio. Una vez que comiences, verás lo fácil que es dejar la galería como mas te guste.

Posted in CSS, Diseño Web, Tutorial | No Comments »

Video tutorial basico de CSS en Dreamweaver

Las hojas de estilo CSS nos ayudan a organizar mejor los estilos que estamos utilizando en los textos, además de ayudarnos a eliminar las tablas.

Si eres de aquellos diseñadores que se la pasa diseñando sitios web muy grandes, y te la pasas haciendo cambios manualmente. Te recomiendo aprender CSS. En el siguiente video tutorial veremos lo básico de CSS en Dreamweaver. Aunque el video nos muestra Dreamweaver 8, sigue siendo útil (en esencia) para Dreamweaver CS3.

Posted in CSS, Dreamweaver, Video Tutorial | 2 Comments »