Задать вопрос
@karetsky
html

Как правильно сделать наложение с прозрачностью?

Есть пунктирная линия и круги.
Как сделать так, чтобы круги оставались прозрачными, но при этом перекрывали пунктир (чтобы пунктира внутри кругов небыло видно)?
12fabf3b8cfa4a4f9467b540433a3e62.png

//Конечно, можно сделать не 1 пунктирную линию, а много, но может есть вариант и с 1 линией...
  • Вопрос задан
  • 465 просмотров
1 комментарий
Подписаться 1 Оценить 1 комментарий
Пригласить эксперта
Ответы на вопрос 1
@Chekhoved
От кругов с помощью before и after в обе стороны абсолютноспозиционированные блоки с нулевой высотой и пунктирной рамкой.

.circle {
	position: relative;
}
.circle::before,
.circle::after {
	position: absolute;
	content: "";
	top: 5px;
	with: 100px;
	height: 0;
	border-top: 1px dotted white;
}
.circle::before {
	left: -100%;
}
.circle::after {
	right: -100%;
}
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Разработать Backend для сайта
02 мая 2024, в 21:12
35000 руб./за проект
Разработка программной системы для решения задач прочности конструкций
02 мая 2024, в 21:10
30000 руб./за проект
Реализация авторизации на сайте через Госуслуги
02 мая 2024, в 20:43
5000 руб./за проект
Ещё заказы