Сжатие: свойство 'clip'
Сжимаемая область определяет, какая часть выводимого содержимого элемента видна. По умолчанию сжатая область имеет тот же размер и форму, что и бокс(ы) элемента. В то же время сжимаемая область может быть модифицирована свойством 'clip'.
'clip'
Значение: <shape> | auto | inherit
Начальное: auto
Применяется: к элементам уровня блока и к замещаемым элементам
Наследуется: нет
Процентное: N/A
Носитель: визуальный
Свойство 'clip' применяется к элементам, имеющим свойство 'overflow' со значением, отличным от 'visible'.
Значения имеют следующий смысл:
auto
Cжимаемая область имеет тот же размер и размещение, что и бокс(ы) элемента.
<shape>
В CSS2 верными значениями для <shape> являются: rect (<top> <right> <bottom> <left>) где <top>, <bottom> <right>, а <left> специфицирует смещение относительно соответствующих сторон бокса.
<top>, <right>, <bottom> и <left> могут иметь или значение <length>, или 'auto'. Отрицательные значения разрешены. Значение 'auto' указывает, что данный край сжимаемой области будет тем же, что и край генерируемого бокса элемента (т.е. 'auto' означает то же, что '0'.)
Если координаты округляются до пикселных значений, необходимо следить, чтобы не осталось видимых пикселов, когда <left> + <right> равно ширине элемента (или <top> + <bottom> равно высоте элемента), и наоборот, чтобы не оставалось невидимых пикселов, когда эти значения равны 0.
Предки элемента могут также иметь сжатые области (в тех случаях, когда их свойство 'overflow' - 'visible'); то, что отображается, находится на пересечении различных сжатых областей.
Если сжатая область выходит за пределы окна документа ПА, содержимое может быть сжато до размеров окна среды окружения.
Эти два правила:
P { clip: rect(5px, 10px, 10px, 5px); } P { clip: rect(5px, -5px, 10px, 5px); }
создадут прямоугольную сжимаемую область, ограниченную пунктирной линией:
[D]Примечание. В CSS2 все сжимаемые области прямоугольны. Мы предполагаем в будущем расширение, разрешающее непрямоугольное сжатие
