Свойство клипа CSS
Пример
Вырезать изображение:
img {
position: absolute;
clip: rect(0px,60px,200px,0px);
}
Определение и использование
Что произойдет, если изображение больше, чем содержащий его элемент?
Свойство clip
позволяет указать прямоугольник для обрезки абсолютно позиционированного элемента. Прямоугольник определяется как четыре координаты, все из верхнего левого угла элемента, который нужно обрезать.
Примечание . Свойство clip
не работает, если «переполнение: видимое».
Примечание . Свойство clip
устарело и будет заменено им в будущем.
clip-path
Значение по умолчанию: | авто |
---|---|
Унаследовано: | нет |
Анимация: | да. Читать об анимации |
Версия: | CSS2 |
Синтаксис JavaScript: | объект .style.clip="прямой (0px, 50px, 50px, 0px)" |
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, которая полностью поддерживает это свойство.
Property | |||||
---|---|---|---|---|---|
clip | 1.0 | 8.0 | 1.0 | 1.0 | 7.0 |
Синтаксис CSS
clip: auto|shape|initial|inherit;
Значения свойств
Value | Description | Play it |
---|---|---|
auto | No clipping will be applied. This is default | |
shape | Clips an element. The only valid value is: rect (top, right, bottom, left) | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Связанные страницы
Учебное пособие по CSS: CSS-позиционирование
Справочник по HTML DOM: свойство clip