css властивість clip
Властивість clip визначає розміри прямокутної області позиціонованого елемента, в якій буде показано його вміст.
Все, що не поміщається в цю область, буде обрізано та стане невидимим.
Властивість clip працює тільки з абсолютно позиційованими елементами (зі значеннями position і fixed) та не працює якщо для елемента задана властивість overflow: visible.
Як значення використовується відстань від краю елемента до області вирізки, яке задається в одиницях CSS - пікселі (px), em та ін. Якщо край області потрібно залишити без змін, слід встановити auto.
| Нотатка: | Властивість |
Синтаксис
clip: auto|shape|initial|inherit;Властивість clip може отримувати 4 значення:
| Значення без задання: | auto |
|---|---|
| Наслідує: | Ні |
| Анімується: | Так |
| JavaScript синтаксис: | object.style.clip="rect(0px,50px,50px,0px)" |
Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
| clip | 1.0 |
4.0 |
1.0 |
1.0 |
7.0 |
| Переглядач | |||
|---|---|---|---|
| clip | 1.0 |
1.0 |
1.0 |
Мобільних переглядачів ще не додано.
Приклади
Визначає область позиціонованого зображення
img {
position: absolute;
clip: rect(0px,60px,200px,0px);
}Динамічний приклад зміни значень clip
Простий приклад
Демонстрація роботи властивості
Динамічний приклад