Блок с классом .content (H1)

Перед вами пример жирного текста. CSS-Framework включает так-же стили для тега^sup и_sub которые не нарушают высоты строк.

Обыкновенный параграф, что тут ещё можно написать. Практически все элементы в контейнере класса .content имеют нижний отступ в 11px.

Кусок CSS-стилей в теге code: * { margin: 0; padding: 0; }

Тег blockquote оформлен вот таким стилем, который вы можете заменить на любой другой.

Это 3 колонки. Каждая колонка шириной 33%.

Ширина колонок меняется классами от 5% до 100% c шагом в 5%.

Это 3 колонки. Каждая колонка шириной 33%.

Ширина колонок меняется классами от 5% до 100% c шагом в 5%.

Это колонка шириной 25%.

Колонка шириной 75%.

Широкая колонка, в которую влезет много текста.

Ссылка и ещё много много бессмысленного текста, для демонстрации параграфов. Дальше вы увидите, какие красивые таблицы получаются с помощью CSS-Framework.

Заголовки th	Столбцов	И их значения
Содержимое таблицы	тег td	тег td
Содержимое таблицы	тег td	тег td

Заголовок второго уровня (H2)

Ниже мы увидим как выглядят обычные и нумерованные списки.

первый элемент обычного
ненумерованного списка
третий пункт
последний пункт

это нумерованный список
второй элемент
третий
и последний

Заголовок третьего уровня (H3)

Список определений (dl).

Первый термин(dt): Длинное определение термина(dd)
Второй термин: Длинное определение второго термина

Тег pre представлен ниже.

<html>
	<head>
	</head>
	<body>
		[текст]
	</body>
</html>

Заголовок четвёртого уровня H4

Для текстовых блоков можно использовать классы class="a-right" и class="a-left" для выравнивания текста.

Пример фоновой PNG-картинки с background-position работающей в IE6.

Картинкам назначена рамка и небольшой отступ. Эти стили будут действовать на все картинки находящиеся в контейнере с классом class="content"

temp image Картинке задан класс class="f-right".

temp image А эта картинка обтекает текст слева, так как ей задан класс class="f-left". Вообще это довольно универсальные классы могут быть назначены любому объекту.