本文通过实例代码介绍了如何使用CSS为div元素添加内阴影和外阴影，展示了详细的样式设置过程，帮助理解CSS阴影效果的实现。内容包括创建两个div，分别为它们设置宽度、高度、边框，并应用内阴影和外阴影，最后呈现了实际效果图。
1.先创建两个div
<body>
<div class="content">
内阴影
</div>
<div class="contentlist">
外阴影
</div>
</body>
2.给两个div设置宽高边框显示到页面，方便后续区分
第一个div的样式
.content{
text-align: center;
line-height: 100px;
border: 1px solid #000000;
width: 300px;
height: 100px;
}
第二个div的样式
.contentlist{
line-height: 100px;
text-align: center;
border: 1px solid #000000;
width: 300px;
height: 100px;
margin-top: 100px;
}
3.第一个div进行内阴影设置
4.第二个div 进行外阴影设置
5.效果图
扫一扫
232
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
