首页 > 代码库 > 2-box-shadow
2-box-shadow
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> .outset-boxShadow { width: 200px; height: 200px; border: 1px solid aquamarine; box-shadow: 10px 5px 6px 20px red inset; /* x轴偏移量 正数，即X轴正方向，一般为右方，负数，左方向 y轴偏移量 阴影模糊半径 其值只能是为正值，如果其值为0时，表示阴影不具有模糊效果，其值越大阴影的边缘就越模糊 阴影扩展半径 阴影颜色 投影方式，默认外阴影，inset为内阴影 */ } .multi-boxShadow{ width: 200px; height: 200px; border: 1px solid royalblue; box-shadow: 10px 5px 6px 20px red inset,-5px 5px 0px 0px #27E143; border-radius:100px; } </style></head><body><p> x轴偏移量，可以当成是在y轴方向阴影的实线宽度 内阴影(inset 可以写在参数的第一个或最后一个，其它位置是无效的)</p><div class="outset-boxShadow"></div><p> 添加多个阴影，只需用逗号隔开即可</p><div class="multi-boxShadow"></div></body></html>
2-box-shadow
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。