how to add shadow on image css code example

Example 1: drop shadow image css

filter: drop-shadow(0px 10px 3px black);

Example 2: image shadow css

<!Doctype>
<html>
<head>
  <style>
    .img {
      width: 400px;
      height: 200px;
      border:2px solid #fff;
      background: url(img/tiger.png) no-repeat;
      box-shadow: 10px 10px 5px #ccc;
      -moz-box-shadow: 10px 10px 5px #ccc;
      -webkit-box-shadow: 10px 10px 5px #ccc;
      -khtml-box-shadow: 10px 10px 5px #ccc;
    }
  </style>
</head>
<body>
  <div class="img"></div>
</body>
</html>

Example 3: add shadow to background image css

box-shadow: inset 0 0 5px 2px #282a2d; /* mark the inset */

Tags:

Css Example