How to add Drop shadow to Elements | Using CSS

CSS provides the box-shadow property which allows us to add drop shadows effects to any elements ,



Here is an example:

HTML Code:
<body>
<div id="shadowBox">
<p>FAQ Web-Development is a blog that intends to share tutorial on HTML,CSS and Jquery.FAQ Web-Development is a blog that intends to share tutorial on HTML,CSS and Jquery.FAQ Web-Development is a blog that intends to share tutorial on HTML,CSS and Jquery.FAQ Web-Development is a blog that intends to share tutorial on HTML,CSS and Jquery.FAQ Web-Development is a blog that intends to share tutorial on HTML,CSS and Jquery.FAQ Web-Development is a blog that intends to share tutorial on HTML,CSS and Jquery.FAQ Web-Development is a blog that intends to share tutorial on HTML,CSS and Jquery.FAQ Web-Development is a blog that intends to share tutorial on HTML,CSS and Jquery.</p>
</div>
</body>


CSS Code:
<style>
             #shadowBox{
width:350px;
height:300px;
margin-left:auto;
margin-right:auto;
border:2px solid #666;
text-align:center;
box-shadow:4px 4px 17px 7px #999;
margin-top:10%;
          }
</style>



    

Comments

  1. Your blog is very useful to all the people especially for Web Developer. So much important information is there in your site and my site is also having valuable information.
    Web Designing Services

    ReplyDelete
    Replies
    1. thanks Harus
      would appreciate if you can like our Facebook page
      cheers,

      Delete
  2. Hi, I went through your this post and found

    really interesting. I landed this page through

    internet search and found
    this page very good.I am a web designer and

    works in a web design

    company

    as a designer I liked the color of your blog

    also.

    Thanks,
    hena

    ReplyDelete

Post a Comment

Thanks for Visiting for any questions or suggestions please comment below
Cheers,

Popular posts from this blog

How CSS3 Works