1. Layout to distinguish is which plate, I just do not look at the layout of the whole, so when the design of the changes, such as the reduction of a plate, moving places more, pit to their own; so be sure to use a label package, div or semantic tags; if you can't tell which piece is the whole, you can look at the reference design, The designer's change is also based on a layer modification, we can think of this layer as the outermost div;
2.CSS Selector parsing rules are right-to-left, which is well known, but still can't control how to write (especially scss)
. Container p{
}
This will increase the browser some additional consumption, so you can be ready to download a Youdao and the like, set the class name is better;
TIP:1) do not because of the style of the element to set the style of the class name, such as a paragraph is red, the class name is red, so difficult to maintain; Red can be called warning; but if you are in a large project, you can define a lighter {font-weight:300! Important, if there are elements that require a thin body, you can use the class name directly
2) do not give the element ID name because of priority, ID is unique, need to be unique element
The 3.web page shows the following steps:
JavaScript (visual changes, such as adding DOM)--style (matches each DOM style)--layout (where the DOM appears on the screen)--paint (filled pixels)--composite (render layer Merge )
Some div + CSS