Создание сайтов на WebPagesDesign.ru (495) 508-5716.

Главная
Портфолио (сайты)
Изготовление сайтов
Продвижение сайта
Информация
   Техническая поддержка
   Прочие услуги
   Документация
   Cправочник html
   Cправочник css
   Cправочник php
Новости и события

тел.: (495) 508-5716
info@webpagesdesign.ru


Новые сайты



www.hutor-2.ru




www.patrisa-nail.ru


Изготовление сайта жилого комплекса "Кореневский хуторок 2"
подробнее

Все работы на одной странице
подробнее

Создание сайта для логистической компании Way Logistic.
подробнее

Сайт ЦСВМ "Штурман"
подробнее

Справочник css.

<clear>

вернуться
CSS CSS2
Значение по умолчанию auto
Наследуется Нет
Применяется К блочным и заменяемым элементам
Аналог HTML Нет
Ссылка на спецификацию http://www.w3.org/TR/CSS21/visufx.php#propdef-clip

Описание

Параметр clip определяет область позиционированного элемента, в которой будет показано его содержимое. Все, что не помещается в эту область, будет обрезано и становится невидимым. На данный момент единственно доступная форма области — прямоугольник. Все остальное остается только в мечтах. Параметр clip работает только для абсолютно позиционированных элементов.

Синтаксис

clip: rect(Y1, X1, Y2, X2) | auto

Аргументы

В качестве аргументов используется расстояние от края элемента до области вырезки, которое задается в единицах CSS — пикселы (px), проценты (%) и др. Если край области нужно оставить без изменений, следует поставить параметр auto, положение остальных значений показано на рис. 1.

Рис. 1. Значения параметра clip

Рис. 1. Значения параметра clip

Пример

Валидный CSS
Валидный HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>clip</title>
<style type="text/css">
#layer {
 position: absolute; /* Абсолютное позиционирование */
 clip: rect(40px, auto, auto, 40px); /* Прячем часть текста */
 width: 200px; /* Ширина блока */
 color: white; /* Цвет текста */
 background: #7f4c3e; /* Цвет фона */
 border: 1px solid black; /* Параметры рамки */
 padding: 10px; /* Поля вокруг текста */
}
</style>
</head>
<body>

<div id="layer">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</div>

</body>
</html>

Результат данного примера показан ни рис. 2.

Рис. 2

Рис. 2. Применение параметра clip в браузере Opera 9.23

Объектная модель

[window.]document.getElementById("elementID").style.clip

Примечание

Браузер Opera 7 (в версии 8 и старше иначе) скрывает только содержимое блочного элемента, а фон и рамку оставляет неизменной. На рис. 3 показан результат приведенного примера в браузере Opera 7.

Рис. 3

Рис. 3. Использование параметра clip в браузере Opera 7

Другие браузеры отображают пример по иному. Так, браузер Firefox скрывает не только текст, но также фон и рамку, как показано на рис. 4.

Рис. 4

Рис. 4. Использование параметра clip в браузере Firefox



Форматирование

  • clear устанавливает, с какой стороны элемента запрещено его обтекание другими элементами. Если установлено обтекание элемента с помощью параметра float, свойство clear отменяет его действие для указанных сторон.
  • clip определяет область позиционированного элемента, в которой будет показано его содержимое. Все, что не помещается в эту область, будет обрезано и становится невидимым. На данный момент единственно доступная форма области — прямоугольник.
  • display многоцелевой атрибут, который определяет, как элемент должен быть показан в документе.
  • float определяет, по какой стороне будет выравниваться элемент, при этом остальные элементы будут обтекать его с других сторон.
  • height устанавливает высоту блочных или заменяемых элементов (к ним, например, относится тег IMG. Высота не включает толщину границ вокруг элемента, значение отступов и полей.
  • overflow управляет отображением содержания блочного элемента, если оно целиком не помещается и выходит за область заданных размеров.
  • visibility предназначен для отображения или скрытия элемента, включая рамку вокруг него и фон. При скрытии элемента, хотя он и становится не виден, место, которое элемент занимает, остается за ним.
  • width устанавливает ширину блочных или заменяемых элементов. Ширина не включает толщину границ вокруг элемента, значение отступов и полей.

  • главная

    статьи
    контакты
    команда

    главная

    2003 - 2010 © Хамикулён | Изготовление сайтов
    тел.: (495) 508-5716
    e-mail: info@webpagesdesign.ru