如何在HTML中添加阴影效果

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

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

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

当鼠标没有滑过图片时

当鼠标滑过图片时

box-shadow:后面有5个数值

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

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

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

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

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

是不是很神奇

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

CSS3的文字阴影—text-shadow

IE中:filter:shadow(Color=颜色值,Direction=数值,Strength=数值)}

.demo {text-shadow: 0 0 20px redfilter:shadow(Color=#0000ff,Direction=10,Strength=10)}

1、你的问题信息比较少,不清楚你具体的需求是什么样的。

2、在HTML中划线的话,使用 hr 标签就可以了。hr ,即为HTML中的水平分隔线。

3、阴影的话主要是使用 box-shadow属性,比如:box-shadow 10px 10px 5px red此属性即为阴影属性,可以控制方向、颜色、以及样式。

4、希望对你有帮助。


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

原文地址: http://outofmemory.cn/bake/11914691.html

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

发表评论

登录后才能评论

评论列表(0条)

保存