html矩形阴影代码,HTML – 如何在中间css中制作阴影

CSS drop-shadows without images by Nicolas Gallagher

Horizontal curves

.drop-shadow {

position: relative;

float: left;

width: 40%;

padding: 1em;

margin: 2em 10px 4em;

background: #FFF;

-webkit-Box-shadow: 0 1px 4px rgba(0,0.3),0 0 40px rgba(0,0.1) inset;

-moz-Box-shadow: 0 1px 4px rgba(0,0.1) inset;

Box-shadow: 0 1px 4px rgba(0,0.1) inset;

}

.drop-shadow:before,.drop-shadow:after {

content: "";

position: absolute;

z-index: -2;

}

.curved-hz-2:before {

top: 0;

bottom: 0;

left: 10px;

right: 10px;

-moz-border-radius: 100px / 10px;

border-radius: 100px / 10px;

}

.curved:before {

top: 10px;

bottom: 10px;

left: 0;

right: 50%;

-webkit-Box-shadow: 0 0 15px rgba(0,0.6);

-moz-Box-shadow: 0 0 15px rgba(0,0.6);

Box-shadow: 0 0 15px rgba(0,0.6);

-moz-border-radius: 10px / 100px;

border-radius: 10px / 100px;

}@H_404_9@

  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

表情包
插入表情
评论将由博主筛选后显示,对所有人可见 | 还能输入1000个字符
相关推荐
©️2020 CSDN 皮肤主题: 深蓝海洋 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值