我该如何制作它？ （Shadows CSS3）

Question

我甚至不介意如何创建它。有任何想法吗？

Answer 1

对阴影效果使用下面的代码。更好地使用CSS而不是阴影效果的图像。因为css很容易创建，编辑和加载。与CSS相比，图像不容易创建，编辑和加载。

<div class="box effect2"> 
     <h3>Effect 2</h3> 
    </div> 


    .box h3{ 
    text-align:center; 
    position:relative; 
    top:80px; 
} 
.box { 
    width:70%; 
    height:200px; 
    background:#FFF; 
    margin:40px auto; 
} 

/*================================================== 
* Effect 2 
* ===============================================*/ 
.effect2 
{ 
    position: relative; 
} 
.effect2:before, .effect2:after 
{ 
    z-index: -1; 
    position: absolute; 
    content: ""; 
    bottom: 15px; 
    left: 10px; 
    width: 50%; 
    top: 80%; 
    max-width:300px; 
    background: #777; 
    box-shadow: 0 15px 10px #777; 
    transform: rotate(-3deg); 
} 
.effect2:after 
{ 
    transform: rotate(3deg); 
    right: 10px; 
    left: auto; 
} 

Reference Link