Dando estilo a blockquote

Escrito por J.F. el Jueves, 4 de Octubre del 2007 a las 16:58

En una ocasión ya hablamos de ésto, pero viendo un post de Anieto2K me he encontrado nuevas formas de representar las frases celebres y citas mediante CSS:

Aquí tienes el código de éste modelo que me ha gustado bastante:

TEXTO PLANO

CSS:

1. blockquote.style5 {
2.   font: 12px/18px normal "Courier New", sans-serif;
3.   padding-left: 70px;
4.   padding-top: 2px;
5.   padding-bottom: 2px;
6.   background-color: #000;
7.   color: white;
8.   border-top: 1px solid #ccc;
9.   border-bottom: 1px solid #ccc;
10.   margin: 5px;
11.   background-image: url(images/openquote5.gif);
12.   background-position: middle left;
13.   background-repeat: no-repeat;
14.   text-indent: 23px;
15.   }
16.   blockquote.style5 div {
17.     padding-right: 50px;
18.     display: block;
19.     background-image: url(images/closequote5.gif);
20.     background-repeat: no-repeat;
21.     background-position: bottom right;
22. }

Enlace: | Diferentes estilos para citas
Descarga: | Descargar ejemplos

Categoria: CSS, General

• Añadir este post a
• Del.icio.us -
• Meneame -
• Digg -
• Webeame

Entradas relacionadas

Deja un comentario

Nombre (obligado)

E-mail (no sera publicado) (obligado)

Pagina web

Puedes usar las siguientes etiquetas HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>