[Summary] CSS accumulated daily summary

1.float and position: absolute | position: fixed default to convert the elements into inline-block, if the element does not specify the width and height, the width and height by the content elements of distraction.

 

2.display: none hidden objects, do not occupy the position after hiding

   visibility: hidden hidden elements, continue to occupy the original position after hiding

   overflow: visible | auto | hidden | scroll does not cut content add scroll bars | exceeds displayed scroll bar does not exceed the scroll bars | excess part of the hide | always show scrollbars

 

3. Only position: relative | absolute | fixed z-index is set to take effect (positive and negative values ​​are 0), the rest of the standard flow, float, are not static positioning of this property.

 

4. The floating elements are always looking for the nearest parent element alignment, but will not exceed the margin within the range of the parent element

 

5. If a box is not given width | height or width of the box | inherits its parent element height width | height, the padding is provided does not affect the size of the box

 

6. The vertical collapse Margin:

  6.1 vertical outer element adjacent blocks from collapsing:

    When two vertically adjacent block elements meet, the above-membered element has margin-botton, the following elements have margin-top, the vertical spacing between them is not the margin-bootom margin-top and the sum, but the two the larger of those.

    Solution: Try to avoid the same time setting up and down outside the adjacent an element.

  6.2 nested block elements of vertical margins collapse:

    For the nested relationship of two block elements, if not the parent element and the upper frame padding, sub-elements and the distance will be on the outside of the outer case of merger from the parent element, outside the combined distance of both relatively the larger, on the outside even if the parent element from the merger will occur 0.

    Solution 1: parent element is provided to one pixel on the frame or the top margin.

    Solution 2: add an element to the parent overflow: hidden and so trigger BFC.

 

7.CSS priority:

  

  7.1 Inherited weight is 0 (weight calculated inherited the same situation is not laminated is set out property itself)

  7.2 Priority Summary:

    7.2.1 use! Regular import declaration

    7.2.2 embedded declared in style attributes of the HTML elements inside

    7.2.3 using the ID selector rules

    7.2.4 Use class selectors, selectors rule properties, pseudo-elements and pseudo-class selector

    7.2.5 using the element selector rules

    7.2.6 contains only a general rule selector

    7.2.7 Class selectors follow the same principle of proximity

 

 

 

    

 

Guess you like

Origin www.cnblogs.com/buerjiongjiong/p/11941698.html