HTML and CSS Reference
In-Depth Information
•
Background sizing:
You can scale background images using the new
background-size property
. While scaling won't look good on
many background images, it could be really handy on abstract, grunge-
type backgrounds, where tiling can be di
!
cult and where some image
distortion would be unnoticeable.
•
Gradients:
While just part of a CSS3 draft spec, Safari, Chrome and
Firefox support declaring multiple color and placement values in the
background-image
property to create gradients without images. This
allows the gradients to scale with their container — unlike image
gradients — and eliminates the need for page users to download yet
another image while viewing your site.
CSS3 lets you do the following with borders:
•
Rounded corners:
Use the
border-radius-property
to get
rounded corners on
div
s, buttons, and whatever else your heart
desires — all without using images or JavaScript.
•
Images for borders:
With CSS 2.1, the only way to create a graphic
border was to fake it with background images, often multiple ones
pieced together on multiple
div
s. You can now add unique borders
without having to use background images by adding the images to the
borders directly, using the new
border-image property
, which also
allows you to control how the images scale and tile.