CSS Example

Human beings understand a particular topic more clearly if it is explained with the help of examples. It is their basic instinct. A small and suitable example can get your task done than thousands of words. If you are ignorant about a particular topic, the first thing that strikes your mind is looking for examples. The same convention is applied in case of web design in general and Cascading Style Sheets in particular. CSS beginners always seek suitable and powerful examples on various CSS rules, properties and techniques.

A CSS example must be present in every topic for thorough understanding. Css-faq.com has understood this need well and incorporated a large number of examples in all learning resources whether articles, blogs or video tutorials. The CSS example must be appropriate and relevant to the topic, otherwise users will be misled. Many CSS tips and tricks are explained with the help of example. Most of them can be found in the articles posted at Css-faq.com. A couple of them are explained below. In CSS, the styling of fonts is done in the following manner.

font-weight: bold;
font-style: italic;
font-variant: small-caps;
font-size: 1.2em;
line-height: 1.5em;
font-family: sans-serif, verdana

There is no need of such a lengthy piece of code, when by using CSS font shorthand rule you can write the whole style in a single line.

font: bold italic small-caps 1em/1.5em sans-serif, verdana

However, there is a problem associated with it. This version of CSS shorthand will be able to produce the desired result, if both font-family and font-size are specified. There is another condition. The font-family must be mentioned at the end of the code and the font-size must come just before this. If the command doesn’t contain the font-weight, font-style and font-variant properties, then default ‘normal’ values will be applied. So be careful about these things before using the font shorthand rule.

Web designers write the border rule in a particular order like specification of the color, width and style. For example: border: 3px solid #000. The output of the code will be a black solid border which is 3 pixels thick. But you need not specify three values here. You only require mentioning the border style. You can come across many such interesting examples at Css-faq.com for the benefit of CSS beginners. After all, a small CSS example speaks a thousand words.