Как нарезать цвет фона с элементом до / после - PullRequest
Новая
       1

Как нарезать цвет фона с элементом до / после

1 голос
/ 12 октября 2019

пожалуйста, посмотрите на мой пример Я добавил цвет фона, и теперь я хочу нарезать некоторую точку и должен быть с прозрачным фоном, как я добавил 

.single_cat_list_in .meta:before {
    content: "";
    width: 20px;
    height: 20px;
    background: #ffffff !important;
    position: absolute;
    right: -35px;
    bottom: -10px;
    border-radius: 50%;
    border-left: 1px solid rgba(0, 0, 0, 0.5);
}

https://prnt.sc/pi94k5

1 Ответ

0 голосов
/ 12 октября 2019

Вы можете использовать несколько линейных и радиальных градиентов для создания закругленных углов (взято из этой статьи ): 

.item {
  height: 100px;
	background:
		linear-gradient(45deg, transparent 10px, gold 0) top left,
		linear-gradient(315deg, transparent 10px, gold 0) top right,
		linear-gradient(225deg, transparent 10px, white 0) bottom right,
		linear-gradient(135deg,  transparent 10px, white 0) bottom left;

	background-image:
		radial-gradient(circle at 0 100%, transparent 14px, gold 15px),
		radial-gradient(circle at 100% 100%, transparent 14px, gold 15px),
    radial-gradient(circle at 100% 0, transparent 14px, white 15px),
		radial-gradient(circle at 0 0, transparent 14px, white 15px);

	background-size: 50% 50%;
	background-repeat: no-repeat;
}

body {
  background: silver;
}
<div class="item"></div>
...