如何在HTML中添加阴影效果

如何在HTML中添加阴影效果,第1张

在我们浏览网页的时候会发现有的网页在你鼠标划过的时候边缘会出现一层阴影效果,就比如

然后在样式中添加box-shadow,因为是鼠标滑到图片上面才显示阴影,所以我们要设置滑动,在滑动里面添加box-shadow,这里我是设了双层的阴影,就是给了双份的box-shadow,中间用逗号隔开,第一层控制图片外围的一圈白边,第二层控制阴影

当鼠标没有滑过图片时

当鼠标滑过图片时

box-shadow:后面有5个数值

第1个长度值⽤来设置对象的阴影⽔平偏移值。⽔平偏移量正值向, 右负值向左;

第2个长度值⽤来设置对象的阴影垂直偏移值。垂直偏移量正值向 ,下负值向上;

第3个长度值则⽤来设置对象的阴影模糊值。模糊度不能为负值;

第4个长度值则⽤来设置对象的阴影外延值。不允许负值

第5个是设置对象的阴影的颜⾊

是不是很神奇

我学识有限,若有错误,还望及时指出,以免误导他人,谢谢!!!

建议LZ将文字加工成图片的形式,一种正常,一种带阴影效果..将这两张图片分别做成鼠标经过图片就可以了..如果你明白CSS的话,也可以用CSS来对鼠标经过状态进行定义..如果不明白 直接在DW中执行 插入---图像对象---鼠标经过图像..在d出的对话框中设置鼠标经过状态的两种状态分别显示的图片就可以了!


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7280318.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-03
下一篇 2023-04-03

发表评论

登录后才能评论

评论列表(0条)

保存