css: box-shadow

.bax {
    box-shadow: 0 0 12px #ddd;
}

box-shadow: h-shadow v-shadow blur spread color inset;

  • h-shadow: 必需的。水平阴影的位置。允许负值
  • v-shadow: 必需的。垂直阴影的位置。允许负值
  • blur: 可选。模糊距离
  • spread: 可选。阴影的大小
  • color: 可选。阴影的颜色。在CSS颜色值寻找颜色值的完整列表
  • inset: 可选。从外层的阴影(开始时)改变阴影内侧阴影
/* offset-x | offset-y | color */
box-shadow: 60px -16px teal;
 
/* offset-x | offset-y | blur-radius | color */
box-shadow: 10px 5px 5px black;
 
/* offset-x | offset-y | blur-radius | spread-radius | color */
box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
 
/* inset | offset-x | offset-y | color */
box-shadow: inset 5em 1em gold;
 
/* Any number of shadows, separated by commas */
box-shadow: 3px 3px red, -1em 0 0.4em olive;

 

上一篇:2021-02-25


下一篇:css实现1px 像素线条_解决移动端1px线条的显示方式