Главная страница   /   9.5. Цитирование текста из другого источника (Руководство по HTML5

Руководство по HTML5

Руководство по HTML5

Адам Фриман

9.5. Цитирование текста из другого источника

Элемент blockquote обозначает блок контента, который цитируется из другого источника. Этот элемент имеет схожую цель, что и элемент q, описанный в главе 8, но, как правило, применяется для больших объемов цитируемого содержания. В таблице 9-5 представлен элемент blockquote.

Таблица 9-5: Элемент blockquote
Элемент blockquote
Тип элемента Потоковый
Разрешенные родительские элементы Любой элемент, который может содержать потоковые элементы
Локальные атрибуты cite
Содержание Потоковый контент
Стиль тегов Открывающий и закрывающий теги
Новый в HTML5 Нет
Изменения в HTML5 Нет
Соглашение по стилям
blockquote { display: block; margin-before: 1em;
margin-after: 1em; margin-start: 40px;
margin-end: 40px; }

Атрибут cite может быть использован для представления URL оригинального источника контента, как показано в листинге 9-5.

Листинг 9-5: Использование элемента blockquote
<!DOCTYPE HTML>
<html>
<head>
	<title>Example</title>
	<meta name="author" content="Adam Freeman" />
	<meta name="description" content="A simple example" />
	<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
<body>
	<p>
		I like apples and oranges.
	I also like bananas, mangoes, cherries, apricots, plums, peaches and grapes.
	You can see other fruits I like <a href="fruitlist.html">here</a>.
	</p>
	<p>
		My favorite kind of orange is the mandarin, properly known
	as <i>citrus reticulata</i>.
	Oranges at my local store cost <s>$1 each</s> $2 for 3.
	</p>
	<blockquote cite="http://en.wikipedia.org/wiki/Apple">
		The apple forms a tree that is small and deciduous, reaching 3 to 12 metres
	(9.8 to 39 ft) tall, with a broad, often densely twiggy crown.
	The leaves are alternately arranged simple ovals 5 to 12 cm long and 3–6
	centimetres (1.2–2.4 in) broad on a 2 to 5 centimetres (0.79 to 2.0 in) petiole
	with anacute tip, serrated margin and a slightly downy underside. Blossoms are
	produced in spring simultaneously with the budding of the leaves.
	The flowers are white with a pink tinge that gradually fades, five petaled,
	and 2.5 to 3.5 centimetres (0.98 to 1.4 in) in diameter.
	The fruit matures in autumn, and is typically 5 to 9 centimetres (
	2.0 to 3.5 in) in diameter.
	The center of the fruit contains five carpels arranged in a five-point star,
	each carpel containing one to three seeds, called pips.
	</blockquote>
	<p><strong>Warning:</strong> Eating too many oranges can give you heart burn.</p>
	<p>
		The
		<abbr title="Florida Department of Citrus">FDOC</abbr>
		regulates the
	Florida citrus industry.
	</p>
	<p>
		I still remember the best apple I ever tasted.
	I bought it at <time datetime="15:00">3 o'clock</time>
		on <time datetime="1984-12-7">December 7th</time>.
	</p>
</body>
</html>

Вы можете увидеть, как браузер применяет стиль этого элемента на рисунке 9-4.

Рисунок 9-4: Использование элемента blockquote

Совет

Вы видите на рисунке 9-4, что браузер игнорирует любое форматирование внутри элемента blockquote. Вы можете добавить структуру цитируемому содержанию, если добавите другие группирующие элементы, такие как p или hr (как показано в следующем примере).