Właściwość klipu CSS
Przykład
Przytnij obraz:
img {
position: absolute;
clip: rect(0px,60px,200px,0px);
}
Definicja i użycie
Co się stanie, jeśli obraz jest większy niż element zawierający?
Właściwość clip
pozwala określić prostokąt do przycięcia elementu pozycjonowanego bezwzględnie. Prostokąt jest określony jako cztery współrzędne, wszystkie od lewego górnego rogu elementu do przycięcia.
Uwaga: Właściwość clip
nie działa, jeśli "overflow:visible".
Uwaga: nieruchomość clip
jest przestarzała i zostanie zastąpiona w przyszłości.
clip-path
Domyślna wartość: | automatyczny |
---|---|
Dziedziczny: | nie |
Animowalny: | tak. Przeczytaj o animacji |
Wersja: | CSS2 |
Składnia JavaScript: | obiekt .style.clip="rect (0px,50px,50px,0px)" |
Obsługa przeglądarki
Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.
Property | |||||
---|---|---|---|---|---|
clip | 1.0 | 8.0 | 1.0 | 1.0 | 7.0 |
Składnia CSS
clip: auto|shape|initial|inherit;
Wartości nieruchomości
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 |
Powiązane strony
Samouczek CSS: Pozycjonowanie CSS
Odniesienie HTML DOM: właściwość klipu