5 tips for CSS style sheet design

Source: Internet
Author: User

1. CSS simplified font rules
When css is used to define the font, you may do the following:
Font-size: 1em;
Line-height: 1.5em;
Font-weight: bold;
Font-style: italic;
Font-variant: small-caps;
Font-family: verdana, serif;

In fact, you can abbreviated these attributes:
Font: 1em/1.5em bold italic small-caps verdana, serif
It is much better now, but note that you must specify at least the font-size and font-family attributes, and other attributes (such as font-weight, font-style, if not specified, the default value is automatically used.
2. Use two classes at the same time
Generally, we only specify one class for the attribute, but this does not mean that you can only specify one class. In fact, you can specify the class as much as you want. For example:
<P class = "text side">... </p> by using two classes at the same time (separated by spaces rather than commas), this section applies the rules set in both classes at the same time. If there are any overlapping rules, the latter will be applied first.
3.default value of border (border) in CSS
When writing a border rule, you usually specify the color, width, and style (in any order ). For example, border: 3px solid #000 (black solid-line border with 3 pixels wide). In this example, the only value to be specified is the style. If you specify the style as solid (solid), the remaining values will use the default value: the default width is medium (equivalent to 3 to 4 pixels ); the default color is the text color in the border. If this is exactly what you want, you can not specify it in css.
4 .! Important will be ignored by IE
In css, the last rule is usually given priority. However, for browsers other than IE, anything is marked later! Important statements obtain absolute priority, for example, margin-top: 3.5em! Important; margin-top: 2em the top boundary of all browsers except IE is 3.5em, while IE is 2em. Sometimes this is useful, especially when using relative boundary values (as in this example), you can see the nuances between IE and other browsers. (Many people may also notice that the css sub-selector will be ignored by IE)
5. Image replacement skills
It is generally wise to use standard html instead of images to display text. In addition to accelerating download, it is also possible to achieve better availability. However, if you are determined to use fonts that may not exist on the visitor's machine, you can only select images.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.