HTML --- CSS positioning the study notes

Disclaimer: This article is a blogger original article, follow the CC 4.0 BY-SA copyright agreement, reproduced, please attach the original source link and this statement.
This link: https://blog.csdn.net/qq_44779847/article/details/102741954

Targeting + ###. 1. 4
#### positioning position

  • ** Static positioning (positioning the document flow) ** default: static, block elements are arranged from top to bottom, from left to right within a row of elements, by controlling the position of an element outside the element.
    - relative positioning: relative , without departing from the document flow element, by left / right / top / bottom positions shifted from the element do an initial position
    when a need to change the position of the element, and the other elements of the case of using relative positioning unaffected

  • Absolute,: absolute positioning element from the document flow through the left / right / top bottom moving element, the element coordinates relative to the window (the default) or to an upper level element /
    using absolute when the element needs to be changed position, and does not want to keep the original position locate

- fixed positioning: fixed, the element from the document flow through the left / right / top bottom moving element, the element coordinates with respect to only / window.
When using a fixed element positioned at a required position of a window is fixed

#### float position

  • From the document flow, floating elements from the current line to the left or to the right, hit the stop when the parent element borders or other floating elements
  • Float line fit will automatically wrap, line feed is likely to be the main card
  • When other elements above the floating element will go on top of the element, if the element is moved up undesirable attribute can be added to the clear element.
  • When all child elements all floating, automatic identification of a height of 0, by adding elements to the overflow: hidden resolve this problem.
  • Margin position by the control element
  • When it is desired to change the transverse elements arranged longitudinally floating targeting
    ### disposed overflow overflows
  • hidden: out of range does not show
  • visible (default): out of range display
  • scroll: scroll out of range

Guess you like

Origin blog.csdn.net/qq_44779847/article/details/102741954