Как правило, содержимое элемента видно целиком в области, отведенной под элемент на экране. Свойство clip определяет окошко внутри этой области, позволяя вам скрыть части элемента и привлечь внимание к какому-либо участку или аспекту содержимого.
У свойства clip значением по умолчанию является auto, согласно которому окошко просмотра совпадает с прямоугольником, включающим в себя элемент. В качестве альтернативы можно указать геометрическую фигуру, определяющую окошко просмотра в пределах области на экране, отведенной под элемент. В настоящее время единственной фигурой, поддерживаемой стандартом CSS21, является прямоугольник, задаваемый с помощью ключевого слова rect. Например:
p {
overflow : hidden;
clip : rect(15px, -10px, 5px, 10px)
}
Эти четыре значения определяют верхнюю, правую, нижнюю и левую стороны усекающего прямоугольника. Каждое значение является смещением относительно сторон прямоугольника, включающего в себя элемент. В нашем примере верхняя сторона усекающего прямоугольника расположена на 15 пикселов ниже верхней стороны прямоугольника, содержащего элемент, правая сторона – на 10 пикселов правее
соответствующей правой стороны, нижняя – на 5 пикселов выше нижней стороны, а левая – на 10 пикселов правее левой стороны.
Обратите внимание, что свойство clip имеет силу только в том случае, когда свойство overflow данного элемента имеет значение, отличное от visible. Когда overflow равно visible, усечение не происходит и свойство clip игнорируется.