Cytat blokowy jest wyświetlany w przeglądarkach zgodnych ze standardami z efektem „duże cudzysłowy przed” oraz w IE z grubą lewą ramką i jasnoszarym tłem.
W przeciwieństwie do innych technik cytowania bloków, ten styl nie wymaga zagnieżdżonego elementu blokowego (takiego jak p). W związku z tym zamienia akapit w element ze stylem wbudowanym, aby zawartość nie spadła poniżej cytatu.
blockquote ( background: #f9f9f9; border-left: 10px solid #ccc; margin: 1.5em 10px; padding: 0.5em 10px; quotes: "\201C""\201D""\2018""\2019"; ) blockquote:before ( color: #ccc; content: open-quote; font-size: 4em; line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.4em; ) blockquote p ( display: inline; )
Przykład
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.