CSS Shadows

Add CSS Shadows around <DIV> content

CSS/JS files (add code to <HEAD> section):


<!-- DC Shadows CSS -->
<link type="text/css" rel="stylesheet" href="dreamcodes/css_shadows/css/tsc_css_shadows.css" />

Lifted corners
Add your content here!

Curled corners
Add your content here!

Perspective
Add your content here!

Raised box
Add your content here!

Single vertical curve
Add your content here!

Vertical curves
Add your content here!

Single horizontal curve
Add your content here!

Horizontal curves
Add your content here!

image
Rotated [DIV] with image.

View code:

      	
<!-- DC CSS Shadows Start -->
  <div class="css_image_shadows">
    <div class="drop-shadow lifted" style="width:240px;height:70px;">
      <p>Lifted corners<br /><small>Add your content here!</small></p>
    </div>
    <div class="drop-shadow curled" style="width:240px;height:70px;">
      <p>Curled corners<br /><small>Add your content here!</small></p>
    </div>
    <div class="drop-shadow perspective" style="width:240px;height:70px;">
      <p>Perspective<br /><small>Add your content here!</small></p>
    </div>
    <div class="drop-shadow raised" style="width:240px;height:70px;">
      <p>Raised box<br /><small>Add your content here!</small></p>
    </div>
    <div class="drop-shadow curved curved-vt-1" style="width:240px;height:70px;">
      <p>Single vertical curve<br /><small>Add your content here!</small></p>
    </div>
    <div class="drop-shadow curved curved-vt-2" style="width:240px;height:70px;">
      <p>Vertical curves<br /><small>Add your content here!</small></p>
    </div>
    <div class="drop-shadow curved curved-hz-1" style="width:240px;height:70px;">
      <p>Single horizontal curve<br /><small>Add your content here!</small></p>
    </div>
    <div class="drop-shadow curved curved-hz-2" style="width:240px;height:70px;">
      <p>Horizontal curves<br /><small>Add your content here!</small></p>
    </div>
    <div class="drop-shadow lifted rotated">
      <p><img src="http://pimg.co/p/200x120" alt="image" width="200" height="120" vspace="9" /><br />
        Rotated [DIV] with image.</p>
    </div>
  </div>
<!-- DC CSS Shadows End -->


© TemplateAccess