feed twitter facebook LinkedIn facebook

CSS » Pseudo-elementos tipograficos: Primera línea de un parrafo

Noviembre 27, 2007 por Víctor Cuervo . 7877 visitas 1 Comentario Imprimir Imprimir

Mediante el pseudo-elemento CSS first-line podemos modificar las propiedades de la primera línea de un párrafo. Entendemos como primera línea, donde el navegador corta el párrafo por coincidir con el final del navegador.

Las propiedades que podemos modificar en el pseudo-elemento CSS first-line son las siguientes:

  • propiedades font
  • propiedades color
  • propiedades background
  • word-spacing
  • letter-spacing
  • text-decoration
  • vertical-align
  • text-transform
  • line-height
  • clear

Así, por ejemplo podemos especificar el siguiente código:

<style text="text/css">

p:first-line{
	color:#0000ff;
	text-transform:uppercase;
}

</style>

Donde la primera línea será en color azul y estará en mayúsculas.

Ahora solo nos queda poner un párrafo en nuestra página HTML. Como el siguiente:

<p>En un lugar de la Mancha, de cuyo nombre no quiero acordarme, no ha mucho tiempo que vivía un hidalgo de los de lanza en astillero, adarga antigua, rocín flaco y galgo corredor. Una olla de algo más vaca que carnero, salpicón las más noches, duelos y quebrantos los sábados, lentejas los viernes, algún palomino de añadidura los domingos, consumían las tres partes de su hacienda. El resto della concluían sayo de velarte, calzas de velludo para las fiestas con sus pantuflos de lo mismo, los días de entre semana se honraba con su vellori de lo más fino.</p>

Visualizar el ejemplo | Descargar el código

tags: , , , , , , , , , , ,

Artículos relacionados:

1 comentario »

Redifusión RSS de los comentarios de la entrada. TrackBack URI

  1. mayerlin vergara sanchez
    Febrero 8, 2008 #

    me gusta todo lo que hacen

Deje un comentario

XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

*