Notes and notes

Notes and notes

1.

When to use margin:
When adding a blank space outside the border.
When no background (color) is required in the blank area.
The gap between the two upper and lower boxes needs to be offset. For example, the margin of 15px + 20px will be blank with 20px.

When should padding be used at that time:
When adding a blank space in the border internal test.
When the blank area requires background (color.
The gap between the two boxes that are connected up and down is expected to be equal to the time between the two. For example, the padding of 15px + 20px will get a blank space of 35px.

 

2.

1. The Inline style sheet has a maximum weight of 1000;

2. The weight of the ID selector is 100

3. The weight of the Class selector is 10.

4. the HTML Tag selector has a weight of 1.

5. The inherited weight is the lowest. Calculate it as 0.1.

 

3.

! DOCTYPE is used to parse pages according to W3C standards.

 

4.

The normal stream is on the first layer, floating on the second layer, and relative positioning + absolute positioning on the third layer.

The margin and padding values in the common layer affect each other, but they do not affect both floating and absolute positioning.

The margin and padding values of the floating layer affect the text and images of the ordinary layer (Float is generated for text and images), The absolute positioning of the third layer of the margin and padding affect each other, because they are close relatives. (Only the actual content in the block is affected, and the block border and background are not affected)

Absolute positioning has no effect on the text and box windows of the common layer, and has an impact on the margin and padding values of the floating layer, but is independent of the floating layer and above the floating layer.
In addition, whether it is a common layer, a floating layer, or an absolute positioning layer, it can contain a common layer (the first layer), a floating layer (the second layer ), absolute layer (Layer 3 )...... theoretically, it can be infinitely wrapped. That is, the influence of the margin and padding values, the first layer, the second layer, or the third layer, is relative to the same parent container. In addition, left (right) and top (bottom) values are not added to the absolute positioning here. If left (bottom) values are added, this absolute positioning will run to his closest parent (relative) the same layer.

All are separated from the normal layer, but the absolute positioning elements of floating and left (right) are not set. The absolute positioning elements of top (bottom) are in the same layer and affect each other. Second, the absolute positioning of the ordinary layer performance is the same as floating, but will not squeeze text and images out with their own overlap area.

It is best not to use abosute independently, because if the page is nested too deeply, sometimes you cannot remember that the parent label has set the position: relative Value (I made this mistake today ), in this way, this guy will keep looking for the relative element of his father (only IE6 will always look for it, and other browsers will look for the parent element instead of the grandparent element, this is what I was surprised to find when I modified the page just now .)
When it is mixed with dl dt dd, it is best not to use abosute alone. Otherwise, the compatibility problems that may cause you headaches will appear in IE6/7. In short, you don't need to use it if you encounter any problems. If you use it, you 'd better use it with position: relative.

 

5. About id and class: based on experience, it is best to use id for js and class for css.

 

6.