CSS Super Tips (7)

css| skill 17. Debugging tips: How big is the floor?

When debugging CSS errors, you need to be like a typesetting worker, parsing CSS code line by row. I usually define a background color on the problem layer so that it's clear how much space the layer occupies. Some people suggest using border, the general situation is also possible, but the problem is, sometimes border will increase the size of elements, Border-top and Boeder-bottom will destroy the value of vertical margin, so it is safer to use background.

Another often problematic attribute is outline. Outline looks like a boeder, but does not affect the size or position of the element. Only a few browsers support outline properties, and all I know is Safari, OmniWeb, and opera.

18. CSS Code writing style

In writing CSS code, for indentation, line breaks, spaces, everyone has the writing habits of everyone. After continuous practice, I decided to use the following writing style:

Selector1,
Selector2 {
Property:value;
}

When working with federated definitions, I usually write each selector in a single line, so it's easy to find them in a CSS file. Add a space between the last selector and the curly brace {Each definition is written separately, and the semicolon is directly after the attribute value, without spaces.

I'm used to adding a semicolon after each property value, although the rule allows the last attribute value to be followed by a semicolon, but if you want to add a new style, it's easy to forget to make up the semicolon and create an error, so it's all better.

Finally, close the curly brace to write a single line.

Spaces and line-wrapping are helpful and readable.