7 CSS3 properties one must know

1. border-radius with that one you can create rounded corners

   -webkit-border-radius: 4px;   
   -moz-border-radius: 4px;   
   border-radius: 4px;  
   

   and even circles:

   -moz-border-radius: 50px;
   -webkit-border-radius: 50px;
    border-radius: 50px;
   

2. box-shadow allows you to immediately apply depth to your elements

   -webkit-box-shadow: 1px 1px 3px #292929;
   -moz-box-shadow: 1px 1px 3px #292929;
   box-shadow: 1px 1px 3px #292929;
   

   or

   -webkit-box-shadow: 1px 1px 3px green, -1px -1px blue;
   -moz-box-shadow: 1px 1px 3px green,-1px -1px blue;
   box-shadow: 1px 1px 3px green, -1px -1px blue;
   

   box-shadow accepts four parameters: x-offset y-offset blur color of shadow
3. text-shadow same as box-shadow but applied to text

4. 
   .box {
   background: url(image/path.jpg) 0 0 no-repeat,
    url(image2/path.jpg) 100% 0 no-repeat;
   }
   

   In the case above, first background is placed in the top left position (0 0) and second - the top right position (100% 0)
5. background-size

   background: url(path/to/image.jpg) no-repeat;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
   

6. text-overflow text-overflow property can accept two values:
   • clip
   • ellipsis
   This property can be used to cut off text that exceeds its container, while still providing a bit of feedback for the user, like an ellipsis.

   .box {
      -o-text-overflow: ellipsis;
      text-overflow:ellipsis;
   
      overflow:hidden;
      white-space:nowrap;
   
      border: 1px solid black;
      width: 400px;
      padding: 20px;
   
      cursor: pointer;
   }
   

7. Resize allows us to specify how a textarea is resized. Possible values: both: Resize vertically and horizontally horizontal: Limit resizing to horizontally vertical: Limit resizing to vertically none: Disable resizing

   textarea {   
      -moz-resize: vertical;   
      -webkit-resize: vertical;   
      resize: vertical;   
   }