如上代码,关键是 box-shadow 属性,效果如下:
box-shadow 可以写六个值,其中前两个值是必写,其他全部是可选。
- h-shadow:相对于元素来说,水平阴影的位置。允许负值。
- v-shadow:相对于元素来说,垂直阴影的位置。允许负值。
- blur:模糊量。
- spread:扩展量。用过 Photoshop 的,都很熟悉这几个属性。
- color:阴影的颜色。
- inset:将外部阴影 (outset) 改为内部阴影,省略表示外部阴影。
以上属性都是指阴影的,但是通过巧妙的配合(如本页代码),可以实现发光效果。