CSS

CSS: La propiedad Line-height

Posted on 14-08-20092009 in CSS | 0 comments

La propiedad Line-height especifica el espacio del salto de línea base de un texto.  Los valores son relativos al tamaño de la fuente del elemento y no existen valores negativos.Si dicho valor es un número, la altura de la línea se calcula multiplicando el tamaño de la fuente del elemento por dicho número.

Valores de la propiedad

Valor Descripción
normal Un salto de línea normal. Este es el que se encuentra por defecto.
number Un número que puede ser multiplicado con el tamaño de fuente para establecer la altura de la línea.
length Un salto de línea fixed en px, pt, cm, etc.
% Una altura de línea en porcentaje con el tamaño de la fuente establecido.
inherit Especifica que el valor de la propiedad del salto de línea se debe heredar del elemento padre.

Ejemplo de su funcionamiento

Un ejemplo con porcentajes (cabe destacar que la mayoría de los navegadores el tamaño estándar de salto de línea con porcentajes oscila entre 110% y 120%:

p.small {line-height:90%} 
p.standard { 110%;} 
p.big {line-height:200%} 
p.small {line-height:90%}
p.standard { 110%;}
p.big {line-height:200%}

Un ejemplo con números:

p.standard {line-height: 0.5; } 
p.standard {line-height: 0.5; }

Un ejemplo con píxeles:

p.standard {line-height: 10px; }

read more

Recursos para CSS

Posted on 14-08-20092009 in CSS | 0 comments

Les dejo el artículo Mega CSS Resource Roundup en TripwireMagazine,, con el que acceder a la que puede ser la colección de recursos más importante acerca de los estilos CSS.

En total hay reunidos 50 recursos interesantes, entre herramientas, tutoriales, trucos, hojas de ayuda…. con los que cualquier diseñador y/o desarrollador web podrá mejorar sus conocimientos en el manejo de las hojas de estilo en cascada, CSS.

Interesados en acceder a esta colección de recursos CSS pueden hacerlo desde www.tripwiremagazine.com.

read more

Guia CSS,Las propiedades CSS, I Parte

Posted on 31-07-20102010 in CSS | 0 comments

Conceptos básicos
Agrupación La Agrupacion permite al autor asignar una declaracion a múltiples elementos (selectores).H1, H2, H3, H5 {color: purple;}
Clases
(atributo de etiqueta)		 Los selectores de clases pueden ser usados como un atributo de una etiqueta. Un selector de clase es una cadena de caracteres precedida de un punto. No use el punto cuando se esta referenciando a la clase. No comience el nombre de la clase con un número, aunque IE4/5 se lo permita..example {color: red;}

<P class=”example”> Esto es un ejemplo en rojo. </P>
ID
(atributo de etiqueta)		 Los selectores de ID pueden ser usados como un atributo de una etiqueta. Un selector ID es una cadena de caracteres precedida de un marcador hash (#), y es llamado con el atributo ID=. El marcador hash no aparece en el valor de la ID. Funciona como el selector de clase excepto que el ID solo puede ser usado una vez en el documento.#i5 {color: red;} <P ID=”i5″> Esto es un texto con una ID de ‘i5′. </P>
Selectores contextuales Hechos de uno o mas selectores delimitados por espacios. El ejemplo indica que la negrita sera roja solo cuando se encuente en etiquetas H1.H1 B {color: red;}

<H1>Esto es <B> rojo</B>.</H1> <P>Esto <B>no</B>.</P>
Comentarios Es buena idea dejar comentarios. Afecta a lo que hay dentro, incluso entre lineas./* Esto es un comentario. */
Etiquetas DIV y SPAN Estas dos etiquetas HTML fueron introducidas para soportar CSS. Piense en ellas como etiquetas vacias, las cuales puede rellenar con estilos.DIV se usa para estrucura de formato, bloques de texto.

<DIV align=”center”><H1>Este encabezado</H1></DIV>SPAN es usado para formateado en linea.

<SPAN class=”example”> texto rojo en el parrafo</SPAN>
read more