Как сделать на CSS колечки на линии
1,00
р.
Кто нибудь с таки сталкивался? Нужно в landing page реализовать три колечка на линии.
Ответ
Пример
* { padding: 0 margin: 0 box-sizing: border-box } .circles { border-bottom: 20px solid #00878B } .circle { position: relative border: 20px solid #00878B width: 150px height: 150px margin: 0 auto -20px auto border-radius: 50% box-shadow: 0 3px 5px rgba(0, 0, 0, .2) } .circle:after { content: '' position: absolute bottom: -20px right: 0 width: 50px height: 20px background: #00878B box-shadow: 0 -5px 5px -5px rgba(0, 0, 0, .5) }
Ответ
Пример
* { padding: 0 margin: 0 box-sizing: border-box } .circles { border-bottom: 20px solid #00878B } .circle { position: relative border: 20px solid #00878B width: 150px height: 150px margin: 0 auto -20px auto border-radius: 50% box-shadow: 0 3px 5px rgba(0, 0, 0, .2) } .circle:after { content: '' position: absolute bottom: -20px right: 0 width: 50px height: 20px background: #00878B box-shadow: 0 -5px 5px -5px rgba(0, 0, 0, .5) }
