![]() ![]() Chrome and the Opera 10.5 dev builds don't require the vendor prefix. In Opera, Mozilla, and Safari, you'll need to declare the vendor prefixes. When declaring background size for multiple backgrounds, the declarations are separated by commas just like with background-image. Any browser that supports multiple backgrounds also supports background size. Background SizeĪnother interesting property that is being implemented in recent browsers is support for background size. (I've traditionally always declared it first.) There can only be one colour applied to an element-although with rgba, if you could declare the colour more than once, it'd theoretically be possible to mix colours. However, the colour is always the last thing declared. The shorthand syntax for a normal background includes image, position, and repeat. I threw a bunch of stuff in here to see if you're paying attention. background: url(…) 0 0 repeat, url(…) 5px 5px no-repeat #FFF You can declare multiple backgrounds using the shorthand syntax, as well. background: url(…) 0 0 repeat 10px 100px, url(…) 5px 5px no-repeat 5px 5px #FFF (Actually, according to PPK, Explorer Mac will show the last background declared.) Depending on your design, you may need a single image declared and then declare the multiple background on the next line. background-image: url(…), url(…) įor browsers that don't recognize multiple backgrounds, the entire background declaration will be ignored. The syntax is very straightforward: just separate each background image with a comma. No more having to have nested elements with lots of CSS just to create a layered effect. That sounds wonderful, doesn't it? It is. What are multiple backgrounds when it comes to CSS? I mean the ability to define more than one background image for a single element. I'm covering both features because multiple backgrounds by itself is simple enough, as are CSS gradients, but combining the two is where things get interesting. Two such features that I have been having the pleasure of enjoying are the use of multiple backgrounds and CSS gradients. CSS3 features are making their way into the various browsers and while many are holding off on implementing them, there are those who are venturing ahead and likely running into a world of interesting quirks across the various platforms. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |