CSS Super Tips (4)

css| Tips 10. Do not need to quote the background picture path

To save bytes, I recommend that you do not enclose the background picture path with quotes, because the quotation marks are not required. For example:

Background:url (images/***.gif) #333;

can be written as

Background:url (images/***.gif) #333;

If you add quotes, it can cause some browser errors.

11. Group selector (selectors)

When some element types, classes, or IDs have common attributes, you can use the group selector to avoid multiple duplicate definitions. This can save a lot of bytes.

For example, to define the font, color, and margin of all headings, you can write this:

H1,h2,h3,h4,h5,h6 {
Font-family:lucida Grande,lucida,arial,helvetica,sans-serif;
Color: #333;
Margin:1em 0;
}

If there are individual elements that need to be defined as separate styles when used, you can add new definitions to cover old definitions, such as:

h1 {font-size:2em;}
h2 {Font-size:1.6em;}

12. Specify the style of the link in the correct order

When you use CSS to define multiple state styles for a link, be aware of the order in which they are written, in the correct order: link:visited:hover:active. The first letter is LVHA, you can remember it as love hate (like hate). Why this definition, you can refer to Eric Meyer's "Link specificity".

If your users need to use the keyboard to control, you need to know the focus of the current link, you can also define: the focusing attribute. : The effect of the focus attribute also depends on where you write, if you want the focused element to display: hover effect, you put: focus on: hover front; If you want focused effects to replace: hover effect, you put: focus on: hover behind.