Monday, September 13, 2010

Building Rounded corner boxes with shadows using CSS3:

With CSS3 now its easier to present the web content in more fascinating ways with less effort,the newer version includes a lot of new properties like border-radius ,text-shadow ,box-shadow,box-sizing and resizing ,word wrap and new attribute selectors etc.for more information you can visit www.w3c.org.
Here is a little example of rounded corner box with shadows :
CSS3 Rocks

 (note : if your browser is not CSS 3.0 supported (i.e IE 6,7,8 etc) you will see a simple box :(
you can check a list of supported browsers here)
.

here is the HTML code :

<html>
    <head>
        <title> Rounded corner box with shadow </title>


        <style type="text/css">
<!--
  .box{
    border-radius: 10px;/*for IE >=9 and other supported browsers */  
    box-shadow:7px 7px 3px #a6bbcf;
   -moz-border-radius: 10px;/* for mozilla firefox */
   -moz-box-shadow: 7px 7px 3px #a6bbcf;
   height:200px;
   width:300px;
   background-color:#5283b0;
   margin-left:auto;
   margin-right:auto;
   margin-top:50px;
   overflow:hidden;
      }
   #a{
   color:#d3d3d3;
   text-shadow: 3px 3px 3px #000;
   margin-top:50px;
   margin-left:70px;
   font-size:30px;   
    }
 
--> 
 
</style>

        </head>
<body>

<div class="box">
<div id="a">
CSS3 Rocks </div>
</div></body>
</html>

Plz write me your comments thanks with regards!

3 comments:

  1. CSS3 is the most easiest language i ever know about. The designing using ths language is quite interesting and amazing. software development company

    ReplyDelete
    Replies

    1. windows 7 home premium free download with product key , buy windows 8.1 pro key , windows storage server 2008 activation , free productcode windows 7 home premium , upgrade key from starter to home basic , windows 7 professional 64 bit product keygen , windows 7 activation key , windows 10 activation store , lmBmLC

      office project 2013 keys

      windows 7 ultimate sp1

      windows 10 pro key

      windows 10 pro key free

      Delete
  2. Have new MS Office 2016 and need activation ? ... Share with you a good site that you can get cheap product keys from there. Microsoft Office 2016 Product Key crack allows a user to activate all the programs of MS office 2016, like as MS Office, MS Excel, and power-point.
    https://officetips556.wordpress.com/
    https://tipsforree.weebly.com/
    https://sites.google.com/site/msoffice16info/
    https://easymsofficetips.tumblr.com/
    https://msofficepru.blogspot.com/
    https://profullversion.yolasite.com/
    https://fullversioninfo.jimdofree.com/
    https://msofice16tips.puzl.com/
    http://fullversion.launchrock.com/
    http://office16pro.strikingly.com/

    ReplyDelete

Follow me

Join me on the New Digg Follow ur_sunny on Twitter

Translate

Followers