2024-05-09 16:35:20 +08:00
|
|
|
|
---
|
|
|
|
|
excerpt: >-
|
|
|
|
|
ai:
|
|
|
|
|
这篇文章介绍了CSS样式的具体代码实现,涉及到配置背景颜色、边框弧度、阴影效果、内边距等属性,并通过伪元素::before添加了特殊的装饰(红、黄、绿三个小圆点),展示了如何通过CSS提升页面元素的视觉效果。
|
|
|
|
|
---
|
2024-04-03 18:59:45 +08:00
|
|
|
|
.highlight
|
|
|
|
|
background: #011627
|
|
|
|
|
border-radius: 5px
|
|
|
|
|
box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .4)
|
|
|
|
|
padding-top: 30px
|
|
|
|
|
|
|
|
|
|
&::before
|
|
|
|
|
background: #fc625d
|
|
|
|
|
border-radius: 50%
|
|
|
|
|
box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b
|
|
|
|
|
content: ' '
|
|
|
|
|
height: 12px
|
|
|
|
|
left: 12px
|
|
|
|
|
margin-top: -20px
|
|
|
|
|
position: absolute
|
|
|
|
|
width: 12px
|