Saturday, August 6, 2011

css3 New properties

@font-face:
One major thing that i used my websites,this can be very easily implemented because it is not very technical.

Syntax:  
@font-face {
      font-family: "My_Font";
      src: url(Hettesheler.ttf) format("opentype");
}
.Container{font-family:My_Font;}

Border-Radius                  
 Rounded corner was the popular issue on desighner points.
But now this is the simple and ultimate solution.
But some where this is not a full stop because below version of IE 
still not responding on this so u need to use some 
another solution like i already given image sprite for particluar IE only.
 
Syntax:  #myclass{border-radius:10px;} 
 
Opacity
opacity with hexa decimal code of color,because when you use the prperty opacity it transparent the inner div too.but it works!!

background: rgba(0, 0, 0, 0.5)
it gives transparent background. 

box-shadow:                                 

its like text-shadow property 
box-shadow: 2px 2px 5px 10px #000;
 These are the following values:
  • x-offset
  • y-offset
  • blur
  • color of shadow
The first two values are the offset of the shadow, the third the blur radius, and the fourth value the spread radius. The last value is, of course, the shadow color.        
 Multiple backgrounds :  

.box {  backgroundurl(image/path.jpg) 0 0 no-repeat,   url(image2/path.jpg) 100% 0 no-repeat;  }  
The comma is separator where we place the different backgrounds.
Enjoy !!

No comments:

Post a Comment