Красивый стиль цитаты, извлечённой из текста статьи с помощью CSS.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Pull quotes 1</title>
<style>
body {
font: 13px/1.5 arial, helvetica, sans-serif;
}
article {
width: 500px;
}
.pquote {
float: left;
width: 100px;
background: #ddf;
font-weight: bold;
padding: 13px;
margin: 0 13px 13px 0;
}
blockquote {
margin: 0;
}
</style>
</head>
<body>
<article>
<p>If ever there was evidence of God, the humble pea is it.</p>
<p>Mother Nature has never created something of such perfection, something that takes Darwin's theory of evolution to the extent that a natural element can, over millions of years, evolve into something so flawless.</p>
<aside class="pquote">
<blockquote>
<p>It is not an exaggeration to say that peas can be described as nothing less than perfect spheres of joy.</p>
</blockquote>
</aside>
<p>The green seed of the white-flowering climbing leguminous papilionaceous plant, pisum sativum, has become a dining-table favourite for good reason.</p>
<p>The perfect accompaniment to any meal, the diminutive spherical vegetable brings joy to billions worldwide, be they fresh, frozen, canned or dried.</p>
<p>Even leaving aside the astounding nutritional package, the taste explosion and texture of a well cooked pea is undeniably enough to award this deceptively simple seed the gold-medal of the foodstuff Olympics.</p>
<p>There is debate surrounding the tampering of the form of the original spherical vegetable. The question as to whether the 'mushy' pea is sacrilege or an innovative approach to re-package the perfect product is a sensitive issue. A similar argument arises when approaching the relatively new craze of mangetout. In-depth study is required, but for now it is too early to assess the true importance of this baby pea pod.</p>
<p>In its original form, the pea is a giant amongst food products and a deity of the vegetable world. It is not an exaggeration to say that peas can be described as nothing less than perfect spheres of joy.</p>
</article>
</body>
</html>Страницы в тему:
- Стиль цитаты 2
- Стиль цитаты 3
- Стиль цитаты (Приёмы CSS)
