SVG
clipPath

Android Angular 2 AngularJS CSS HTML Java Language JavaScript jQuery PHP Python Language
Поиск…


параметры

параметр Описание
clipPathUnits система координат содержимого шаблона либо objectBoundingBox, либо userSpaceOnUse

замечания

Связанные данные W3C

Обрезание по круговой траектории

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" xmlns:xlink="http://www.w3.org/1999/xlink">
  <defs>
    <clipPath id="circleClip">
      <circle cx="50" cy="60" r="20" />
    </clipPath>
  </defs>
  <image width="100" height="100" style="clip-path:url(#circleClip)" xlink:href="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png" />
</svg>
Оригинальный логотип Логотип после отсечения
логотиплоготип после отсечения


Modified text is an extract of the original Stack Overflow Documentation
Лицензировано согласно CC BY-SA 3.0
Не связан с Stack Overflow