break-after | Свойство CSS - Справочник CSS3 | Делай сайт
Приветствую Вас, Гость! Регистрация
Георгиевская ленточка
Вторник, 06.12.2016
Главная » Справочник CSS3 » Позиционирование


2D & 3D ТрансформацияСвойства контента
Свойства импортаСвойства углов
Свойства границСвойства анимации
ПсевдоклассыПсевдоэлементы
Свойства размераСвойства контура
Свойства переходаСвойства печати
Свойства тениСвойства отступов
Свойства текстаСвойства колонок
Свойства полейПозиционирование
Свойства интерфейсаТипы значений
Полезные статьиСвойства списка
Свойства шрифтаСвойства таблицы
Свойства фонаВендорные префиксы



Адаптивный сайт - aTmpl


break-after | Свойство CSS

Свойство break-after определяет разрыв колонки после элемента.




Свойство break-after определяет разрыв колонки после элемента в многоколоночном элементе при печати.На момент издания статьи не поддерживалось основными браузерами,браузеры Safari и Chrome поддерживают аналогичное свойство -webkit-column-break-after.Не стоит путать данное свойство со свойством page-break-after определяющим разрыв станицы,а не колонки.Свойство применимо к блочным элементам,создано в версии CSS3 и проходит валидацию согласно версии CSS3.




Дополнительные свойства применяемые к break-after


Свойство
Описание
break-beforeОпределяет разрыв колонки до элемента
break-insideОпределяет разрыв колонки внутри элемента
page-break-afterОпределяет разрыв страницы после элемента
page-break-beforeОпределяет разрыв страницы до элемента
page-break-insideОпределяет разрыв страницы внутри элемента
-webkit-column-break-afterАльтернативное свойство для Safari и Chrome определяющее разрыв колонки после элемента
-webkit-column-break-beforeАльтернативное свойство для Safari и Chrome определяющее разрыв колонки до элемента
-webkit-column-break-insideАльтернативное свойство для Safari и Chrome определяющее разрыв колонки внутри элемента


Дополнительные значения применяемые к break-after


Значение
Описание
autoРазрыв страницы и колонки производит браузер ( принудительного разрыва нет )
alwaysРазрыв страницы производится после элемента
avoidИзбегать разрыва страницы и колонки после элемента
leftПроисходит пропуск одной или двух страниц,чтобы следующая страница была чётной находясь с лева
rightПроисходит пропуск одной или двух страниц,чтобы следующая страница была не чётной находясь с права
pageПринудительный разрыв страницы после элемента
columnПринудительный разрыв колонки после элемента
avoid-pageИзбегать разрыва страницы после элемента
avoid-columnИзбегать разрыва колонки после элемента

Свойство работает в браузерах




Пример применения свойства



<!DOCTYPE html>
<html lang="ru">
<head>
<title>Свойство break-after</title>
<style type="text/css">
<!--
h1 {
text-align:center;
color:#636363;
}
p#avoid {
break-after:avoid;
padding:5px;
background-color:green;
font-size:20px;
color:red;
}
p#avoid-page {
break-after:avoid-page;
padding:5px;
background-color:red;
font-size:20px;
color:green;
}
p#avoid-column {
break-after:avoid-column;
padding:5px;
background-color:indigo;
font-size:20px;
color:yellow;
}
-->
</style>
</head>
<body>
<h1>При печати,после того как свойство будет чмыкать в браузерах разрывов строк и колонок происходить не будет</h2>
<p id="avoid">Избегаем разрыва колонок и страниц</p>
<p id="avoid-page">Избегаем разрыва страниц</p>
<p id="avoid-column">Избегаем разрыва колонок</p>
</body>
</html>

Пример в действии




Поэкспериментируйте сами





Русские шрифты






Источник: http://www.w3.org/TR/CSS21/page.html#propdef-page-break-after
Категория: Позиционирование | Добавил: IZOTOP (07.05.2012) | Автор: Меренков Михаил E W
Просмотров: 1017 | Теги: css, свойство, break-after, style, для чего, что означает, что это | Рейтинг: 0.0/0

Вопросов / Советов / Предложений - относящихся к материалу: 0

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]