Большое количество расположений тени блока с помощью свойства box-shadow CSS3
Генераторы box-shadow CSS
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2)
box-shadow: 0px 0px 6px -3px;
-webkit-box-shadow: inset 0px 3px 21px -3px rgba(46,46,46,0.62); -moz-box-shadow: inset 0px 3px 21px -3px rgba(46,46,46,0.62); box-shadow: inset 0px 3px 21px -3px rgba(46,46,46,0.62);
box-shadow: 0 5px 25px rgba(2, 2, 2, 0.25);
-webkit-box-shadow: inset 0px 3px 21px -3px rgba(46,46,46,0.62); -moz-box-shadow: inset 0px 3px 21px -3px rgba(46,46,46,0.62); box-shadow: inset 0px 3px 21px -3px rgba(46,46,46,0.62);
-webkit-box-shadow: 0px 3px 21px -3px rgba(46,46,46,0.62); -moz-box-shadow: 0px 3px 21px -3px rgba(46,46,46,0.62); box-shadow: 0px 3px 21px -3px rgba(46,46,46,0.62);
box-shadow: 0 2px 5px rgba(0,0,0,0.2), 0 4px 6px rgba(0,0,0,0.2);
box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
box-shadow: 0 8px 26px rgba(0,0,0,0.4), 0 28px 30px rgba(0,0,0,0.3);
box-shadow: 0 20px 16px -16px rgba(0,0,0,0.6);
box-shadow: 0 1px 4px rgba(0,0,0,0.3), -23px 0 20px -23px rgba(0,0,0,0.8), 23px 0 20px -23px rgba(0,0,0,0.8), 0 0 40px rgba(0,0,0,0.1) inset;
box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.3), 1px 1px 5px rgba(255, 255, 255, 1);
box-shadow: 20px -15px 10px 5px rgba(0, 0, 0, .5);
box-shadow: 0 0 10px 5px rgba(221, 221, 221, 1);
box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
box-shadow: 0 5px 5px -5px rgba(0, 0, 0, .5);
box-shadow: 0 -5px 5px -5px rgba(0, 0, 0, .5);
box-shadow: -5px 0 5px -5px rgba(0, 0, 0, .5);
box-shadow: 5px 0 5px -5px rgba(0, 0, 0, .5);
box-shadow: 0 1px 4px rgba(0, 0, 0, 1), -23px 0 20px -23px rgba(0, 0, 0, .8), 23px 0 20px -23px rgba(0, 0, 0, .8), 0 0 40px rgba(0, 0, 0, .1) inset;
box-shadow: 6px 6px #989898, 12px 12px #6c6666;
box-shadow: 0 0 0 1px silver, 0 -20px 0 -10px coral, 20px 0 0 -10px darkturquoise, 0 20px 0 -10px gold, -20px 0 0 -10px green;
border: 3px dashed #ccc; box-shadow: 0 0 0 1px #ccc, inset 0 0 0 1px #ccc;
box-shadow: -20px 20px 0 -17px #eee, 20px -20px 0 -17px #eee, 20px 20px 0 -20px #592385, 0 0 0 2px #592385;
box-shadow: 0 0 40px rgba(0, 0, 0, .2) inset;
box-shadow: 0 3px 3px #575555 inset;
box-shadow: inset 0 0 100px hsla(0,0%,0%,.2), inset 0px 1px 5px #999, inset 0px 2px 0px #888, inset 0px 3px 0px #777, inset 0px 4px 0px #666, inset 0px 5px 0px #555, inset 0px 6px 0px #444, inset 0px 7px 0px #333, inset 0px 8px 7px #001135;
border-radius: 10px; background: rgb(100,100,100) radial-gradient(circle at 50% 0, rgba(255,255,255,.65), rgba(255,255,255,.35)); box-shadow: inset rgba(0,0,0,.6) 0 -3px 8px, inset rgba(252,255,255,.7) 0 3px 8px, rgba(0,0,0,.8) 0 3px 8px -3px;
0 Комментарии