除了为文字添加阴影，我们还可以为盒模型添加阴影。盒模型阴影的属性名称为box-shadow,此属性与text-shadow一样有4个值，前两个值分别表示水平方向位移距离和垂直方向的位移距离，第三个值表示阴影的模糊半径（包含0及以下的值均表示无模糊），最后一个则是阴影的颜色。前Chrome 16+，F ...
分类：
Web程序 时间：
2019-11-18 09:37:52
阅读次数：
65
以下为例： box-shadow:1px 2px 3px 4px color inset; 1px:表示沿x轴的正方向的长度(如果是负数，则为沿x轴的负方向的长度); 2px:表示沿y轴的正方向的长度(如果是负数，则为沿y轴的负方向的长度); 3px:表示阴影的模糊度，并且只能为正数； 4px:表示 ...
分类：
Web程序 时间：
2019-11-17 20:41:25
阅读次数：
128
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> .shadow { box-shadow:5px 5px 5px red; width: 200px; height: 100px; backgro ...
分类：
Web程序 时间：
2019-11-09 18:05:22
阅读次数：
134
box-shaodw在我们的工作中使用以及越来越多，伴随阴影的动画或多或少都有一点。假设，我们有下面这样一个盒子：div{width:100px;height:100px;box-shadow:02px4pxrgba(0,0,0,0.3);}希望hover的时候，盒阴影从box-shadow:02px4pxrgba(0,0,0,0.3)过渡到box-shadow:05px15pxrgba(0,0,
分类：
Web程序 时间：
2019-11-08 09:16:51
阅读次数：
116
css3的滤镜filter属性，可以对网页中的图片进行类似Photoshop图片处理的效果，例如背景的毛玻璃效果、老照片（黑白照片）、火焰效果等。一、blur(px)高斯模糊二、brightness(%)亮度三、contrast(%)对比度四、drop-shadow()阴影注意：这个drop-shadow与box-shadow都是在说阴影，但还是有区别的，看下图图中火焰的图片，是一张png图片，除
分类：
Web程序 时间：
2019-11-06 10:35:48
阅读次数：
123
box-shadow：营造层次感（立体感）、充当没有宽度的边框、特殊效果（无限投影的方式作画等） <style> #box{ width: 200px; height: 200px; background: #ff0000; margin: 100px auto; /*参数：x方向偏移 y方向偏移 ...
分类：
Web程序 时间：
2019-11-06 00:49:02
阅读次数：
119
CSS3 边框 通过 ，您能够创建圆角边框，向矩形添加阴影，使用图片来绘制边框 并且不需使用设计软件，比如 。 您将学到以下边框属性： 、`box shadow border image`。 一、圆角边框border radius 在 中， 属性用于创建圆角： 1.1、border radius语法 ...
分类：
Web程序 时间：
2019-11-03 21:56:34
阅读次数：
107
边框: 盒子圆角：border-radius：5px / 20%； border-radius:5px 4px 3px 2px; 左上，右上，右下，左下。 盒子阴影： box-shadow： box-shadow:x轴偏移量 y轴偏移量 阴影模糊半径(阴影颜色的模糊程度) 阴影扩展半径 阴影颜色 投 ...
分类：
Web程序 时间：
2019-10-31 10:24:53
阅读次数：
276
input:-internal-autofill-selected { /*内置阴影填充 背景颜色*/ box-shadow: inset 0 0 0 1000px #253167! important; /*只有谷歌兼容 字体颜色*/ -webkit-text-fill-color: #fff !... ...
分类：
其他好文 时间：
2019-10-22 16:47:13
阅读次数：
126
card { background color: white; border radius: 8px; width: 100%; border: 1px solid rgba(120, 130, 140, 0.13); } card:hover { box shadow: 6px 11px 41px ...
分类：
其他好文 时间：
2019-10-20 12:57:40
阅读次数：
62
