2009-12-13 5 views
2

J'essaye d'emballer le texte dans quelques grandes doubles guillemets gentils. J'ai regardé this tutorial, mais semble un peu plus compliqué que je pensais que ce devrait être. Mon instinct me dit que quelqu'un ici dans SO sait une manière plus intelligente. Je suis ouvert à tout: CSS, ou PHP ou Javascript, ou Jquery (mais de préférence pas JS/Jquery)De grandes guillemets doubles: le meilleur moyen de les ajouter

+2

Ce tutoriel que vous avez lié est très simple, vous n'aurez rien de plus simple. – McPherrinM

+0

C'est simple, vous avez raison, mais ça ne joue pas bien avec une partie du code que j'ai déjà. Le blockquote par exemple force le rembourrage haut et bas dont je n'ai pas besoin, et les images n'apparaissent même pas. – Fred

+0

@Fred: Avez-vous essayé de jouer avec les valeurs 'padding' /' text-indent'? –

Répondre

2

Le tutoriel ne me semble pas trop compliqué - je pense que leur méthode est plutôt bonne. Si vous ne souhaitez pas spécifier l'une des images de fond dans :first-letter, vous pouvez utiliser le support de CSS3 pour plusieurs images de fond:

blockquote { 
    background: url("open-quote.gif") top left no-repeat, 
      url("close-quote.gif") bottom right no-repeat; 
    /* Other rules... */ 
} 

... mais cela ne fonctionnera que dans some browsers.

Si j'étais vous, j'utiliserais la méthode décrite dans le tutoriel.

2

Je recommande de suivre la méthode qu'ils suggèrent: il suffit d'ajouter un style sur un élément blockquote pour lui donner un image de fond de vos grandes citations.

Si vous voulez une solution pure CSS, vous pouvez utiliser quelque chose comme ceci:

blockquote:before, blockquote:after { 
    content: '"'; 
    font-size: 400%; 
} 

Bien sûr, vous devrez jouer avec les hauteurs de ligne et des marges pour l'obtenir à la recherche ok, mais même alors , ça ne marchera pas dans IE.

Questions connexes