In the working draft of the css3 module ‘background’, the css3 gives the possibility to apply more background images to a single element and not just the single one as specified in the css2 property background.
The css rules to apply multiple background image to an element are simple.
As for the css2, we specify an url for each images to use as background and their position separated by a comma.
An example of css rule to apply the multiple images background in css3:
#multiple_background{
background:url(background1.jpg) no-repeat top right, url(background2.jpg) repeat-x bottom;
}
Next, the test I done to create a banner using 6 images applied to an element 400px wide, 150px high and with a 2px gray border.
Here is an image preview of the result obtained with Safari3.1:
Continue to read >>
CSS3,
css3 background,
css3 multiple background,
css3 property
The css3 property box-shadow allows to add without the use of images a shadow effect to the selected elements.
Thanks to the different values of the box-shadow, we can specify that the shadow is positioned to the left/right or top/bottom on the outside of the element, its gradient of blur and its color.
The box-shadow is not part of the so-called ‘box-model’, meaning that the shadow is not considered in the final total measure of the element.
This css3 property can be combined with other properties such as css3 border-radius.
NB: The css3 property box-shadow is at the moment supported by Safari 3.1+ adding the prefix -webkit., Firefox 3.5+ adding the prefix -moz. (updated May 2009)
Continue to read >>
box shadow,
css shadow,
CSS3,
css3 box-shadow
The css3 module multi-column allows to specify that the content of an element is spread over pre-imposted columns.
The content of the element adapts itself to the space available and we can specify the number (column-count) or the width (column-width) of the columns as desired.
At the moment, the css3 multi-column is only supported by Safari and Firefox (partially) using the correspondent css3: -webkit and -moz.
Continue to read >>
css multi column,
CSS3,
css3 multi-column,
css3 property
Until now, we could specify a font (css property font-family) only with a given name (ex: arial, verdana…) or a font family name (ex:serif), all common font pre-installed with most operative system.
A new css3 module is the Web Fonts into which we can find the property @font-face.
Although this css property was already part of the css2 specifics, only now with the development of the css3, its browser support has started to be taken into account.
For those reasons, it is considered by many as a new css3 property.
The @font-face allows to view a non-common font in our pages.
The idea is that thanks to the @font-face, we can specify an url to a font which will be downloaded and installed to render it available to the web page.
At the moment, the @font-face is supported by Safari3.1+ and Firefox3.5+ (Last update: May 2009)
Continue to read >>
css font-face,
CSS3,
css3 property,
css3 web font
