overflow属性

overflow occur when

  • A line cannot be broken, causing the line box to be wider than the block box.
  • A block-level box is too wide for the containing block. This may happen when an element's 'width' property has a value that causes the generated block box to spill over sides of the containing block.
  • An element's height exceeds an explicit height assigned to the containing block (i.e., the containing block's height is determined by the 'height' property, not by content height).
  • A descendant box is positioned absolutely, partly outside the box. Such boxes are not always clipped by the overflow property on their ancestors; specifically, they are not clipped by the overflow of any ancestor between themselves and their containing block
  • A descendant box has negative margins, causing it to be positioned partly outside the box.
  • The 'text-indent' property causes an inline box to hang off either the left or right edge of the block box.

overflow don't occur when

This property specifies whether content of a block container element is clipped when it overflows the element's box. It affects the clipping of all of the element's content except any descendant elements (and their respective content and descendants) whose containing block is the viewport or an ancestor of the element

reference:http://www.w3.org/TR/CSS21/visufx.html

原文地址:https://www.cnblogs.com/wz0107/p/4673312.html