css 左边阴影_CSS3给DIV左下角和右下角增加阴影

本人新搭建的一个论坛放肆网用的模版比较久了，发现在全屏模式下，论坛模块的

.m-fl-g:before,

.m-fl-g:after {

content: '';

z-index: -1;

position: absolute;

left: 10px;

bottom: 15px;

width: 70%;

max-width: 300px; /* avoid rotation causing ugly appearance at large container widths */

max-height: 100px;

height: 55%;

-webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);

-moz-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);

box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);

-webkit-transform: skew(-15deg) rotate(-6deg);

-moz-transform: skew(-15deg) rotate(-6deg);

-ms-transform: skew(-15deg) rotate(-6deg);

-o-transform: skew(-15deg) rotate(-6deg);

transform: skew(-15deg) rotate(-6deg); }

.m-fl-g:after {

left: auto;

right: 10px;

-webkit-transform: skew(15deg) rotate(6deg);

-moz-transform: skew(15deg) rotate(6deg);

-ms-transform: skew(15deg) rotate(6deg);

-o-transform: skew(15deg) rotate(6deg);

transform: skew(15deg) rotate(6deg); }

最终效果图：

原创文章，作者：锋哥，如若转载，请注明出处：https://www.fangsi.net/999.html