所属专栏:前端只因变凤凰之路
作者简介:rchjr——五带信管菜只因一枚
前言:该系列将持续更新前端的相关学习笔记,欢迎和我一样的小白订阅,一起学习共同进步~
文章简介:本文介绍CSS的阴影效果。知识学习内容来自b站的 @黑马程序员 的视频
CSS的阴影效果包括盒子阴影和文字阴影两种
h-shadow |
阴影在水平方向的位置 |
v-shadow |
阴影在垂直方面的位置 |
blur |
阴影的虚实程度 |
spread |
阴影的大小 |
color |
阴影的颜色 |
inset |
把阴影改成内部(一般默认是外部outset,不建议添加) |
Document
和伪类选择器类似,为div添加:hover。(注意:任何盒子都可以这样写,利用伪类选择器实现)见下面的代码
Document
盒子添加阴影不会改变自身大小,可以放心添加。
可以利用text-shadow来设置文本的阴影
h-shadow |
阴影在水平方向的位置 |
v-shadow |
阴影在垂直方面的位置 |
blur |
阴影的虚实程度 |
spread |
阴影的大小 |
在实际开发用的不多
Document
我是阴影,你是火影