Определяет, как будет располагаться фоновое изображение, будет ли оно заходить под рамку или начинаться с области контента. Отличие от background-origin в том, что свойство background-clip обрезает фоновое изображение.
Примеры
background-clip: border-box;
background-clip: content-box;Значения
| Значение | Описание |
|---|---|
| border-box | По умолчанию. Фон распространяется под рамку элемента. |
| padding-box | Фон распространяется после рамки элемента. |
| content-box | Фон распространяется в области содержимого блока (обрезается при необходимости). |
| text ⚠️ | Фон распространяется только на текст. |
| inherit | Наследует значение родительского блока. |
| initial | Устанавливает значение по умолчанию. |
Поддержка браузерами
НастольныеМобильные
Chrome
Edge
Firefox
IE
Opera
Safari
Chrome
Firefox
Opera
Safari
Samsung
Androidbackground-clip1
1-64 -webkit-
12
4
49 -webkit-
1-4 -moz-
9
10.5
15-51 -webkit-
3 -webkit-
18
18-64 -webkit-
14
49 -webkit-
11
14-47 -webkit-
1 -webkit-
1.0
1.0-9.0 -webkit-
4.1
≤37-64 -webkit-
content-box1
12
4
9
10.5
3
18
14
11
1
1.0
4.1
text3
15
12
49
48
нет
15
4
18
49
48
14
3.2
1.0
≤37
Поддерживается: Да Нет Частично Пользователь должен включить
