русский  עברית
tadam logo
Инструменты
Пользовательское меню с линейными градиентамиЛучший Хостинг
Селекторы CSS
.class#id*elementelement,elementelement elementelement>elementelement+element[attribute][attribute=value][attribute~=value][attribute|=value]:link:visited:active:hover:focus:first-letter:first-line:first-child:before:after:lang
Свойства CSS
Свойства фона
backgroundbackground-attachmentbackground-colorbackground-imagebackground-positionbackground-repeat
Свойства границы и контура
borderborder-bottomborder-bottom-colorborder-bottom-styleborder-bottom-widthborder-colorborder-leftborder-left-colorborder-left-styleborder-left-widthborder-rightborder-right-colorborder-right-styleborder-right-widthborder-styleborder-topborder-top-colorborder-top-styleborder-top-widthborder-widthoutlineoutline-coloroutline-styleoutline-width
Свойства размеров
heightmax-heightmax-widthmin-heightmin-widthwidth
Свойства шрифта
fontfont-familyfont-sizefont-stylefont-variantfont-weight
Генерированные свойства содержания
contentcounter-incrementcounter-resetquotes
Свойства списка
list-stylelist-style-imagelist-style-positionlist-style-type
Свойства поля
marginmargin-bottommargin-leftmargin-rightmargin-top
Свойства заполнения
paddingpadding-bottompadding-leftpadding-rightpadding-top
Свойства позиционирования
bottomclearclipcursordisplayfloatleftoverflowpositionrighttopvisibilityz-index
Свойства печати
page-break-afterpage-break-beforepage-break-inside
Свойства таблицы
border-collapseborder-spacingcaption-sideempty-cellstable-layout
Свойства текста
colordirectionletter-spacingline-heighttext-aligntext-decorationtext-indenttext-transformvertical-alignwhite-spaceword-spacing
Нашли ошибку в тексте?
Отметьте её курсором и нажмите
Ctrl + Enter
Проверка орфографии Xhtml.co.il
Orphus system
Рассылка
Присоединитесь к списку рассылки для получения последних новостей

Введите адрес электронной почты:

Основы CSS
CSSCSS ВведениеСинтакс CSSCSS Id и КлассCSS Как сделать ...
Стили CSS
CSS ФонCSS ТекстCSS ШрифтCSS СсылкиCSS СпискиCSS Таблицы
Модель "коробки" CSS
CSS Модель "коробки"CSS ГраницыCSS КонтурыCSS ПоляCSS Заполнение
Продвинутый CSS
CSS Группировка и вложенные селекторыCSS РазмерыCSS Отображение и ВидимостьCSS ПозиционированиеCSS Свободное перемещениеCSS Горизонтальное выравниваниеCSS Псевдо-классыCSS Псевдо-элементыCSS Панель навигацииCSS Галерея изображенийCSS Прозрачность изображенияCSS Изображение спрайтCSS Типы медиаCSS Селекторы атрибутовCSS Не делайВы выучили CSS, что теперь?
Примеры CSS
CSS Примеры
Ссылки CSS
CSS СправочникCSS Слуховые ссылкиCSS Безопасные комбинации шрифтовCSS ЕдиницыCSS ЦветаCSS Значения цветовCSS Имена цветов
Браузеры
Главная страница браузеров.Статистика браузеровСтатистика ОССтатистика изображенияБраузер ExplorerБраузер NetscapeПроект MozillaБраузер FirefoxБраузер OperaБраузер ChromeБраузер SafariМобильные браузеры

clip

Пример

Отсекает изображение: 
<html>
<head>
<meta charset="utf-8" />
<style>
     img { position:absolute; clip:rect(0px,60px,200px,0px); }
</style>
</head>
<body>
<img src="/images/xhtml-css.png" width="130" height="102" />
</body>
</html>
Результат выполнения кода выше:
Попробуйте сами

Определение и использование

Что произойдет, если изображение будет больше содержащего его элемента? - Свойство clip позволяет указать размеры абсолютно позиционируемых элементов, которые должны быть видны, и элемент обрезается в эту форму, и отображается.

Примечание: Свойство clip не работает если "overflow:visible".

Значение по умолчанию:auto
Унаследованный:нет
Версия:CSS2
Синтакс JavaScript:object.style.clip="rect(0px,50px,50px,0px)"

Поддержка браузеров

Свойство clip поддерживается во всех ведущих браузерах.

Примечание: Значение "inherit" не поддерживается в IE7 и более ранних версиях. IE8 требует !DOCTYPE. IE9 поддерживает "inherit".

Значения свойства

ЗначениеОписаниеИграйте
shapeОтсекает элемент. Единственным допустимым значением является: rect (top, right, bottom, left)Играйте »
autoОтсечение не применяется. Это по умолчаниюИграйте »
inheritУказывает, что значение свойства clip должно быть унаследовано от родительского элемента

Связанные страницы

CSS пособие: CSS Позиционирование

jQuery пособие: css()

Была ли эта информация полезной?
   

Комментарии