随笔 - 3458, 文章 - 0, 评论 - 739, 阅读 - 1188万
  管理

用css给div的border设置阴影

Posted on   lzhdim  阅读(4541)  评论(0编辑  收藏  举报

1、首先新建一个html文件,命名为test.html,使用div标签创建一个模块,用于测试。如下图所示。

2、在test.html文件内,给div添加一个class属性,属性值设置为myway。

3、然后在css标签内,通过class设置div的样式,定义它的宽度为200px,高度为200px,背景颜色为黑色。

4、接着在css标签内,再使用box-shadow属性设置div的阴影效果,其中,左边阴影为绿色,顶部阴影为蓝色,底部阴影为红色,右边阴影为黄色。

5、最后在浏览器打开test.html文件,查看实现的效果,如下图所示就完成了。

相关博文:
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· Obsidian + DeepSeek:免费 AI 助力你的知识管理,让你的笔记飞起来!
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
2025年3月3日 星期一 【蛇】己卯月辛未日 乙巳年 二月初四 全国爱耳日
您的IP:3.15.193.22,操作系统:未知操作系统,浏览器:未知浏览器
Copyright (C) 2000-2025 Lzhdim Software All Rights Reserved
点击右上角即可分享
微信分享提示