基本概念文档流mdnblock,inline,inlineblock？margin合并两个框模型文档流NormalFlow流布局mdn文档流方向从左到右：内联元素就像默认的直到一行被填充，并且新行将从上到下开始：像默认的
这样的块级元素各占一行，不是并排的（注意没有添加样式）eg.css-demo-1withCSSanimation&SCSSinline元素占一行，当空间不够，行会被折叠，也就是中间会被打断显示到下一行。块级元素即使设置为不占宽，也不会合并成一行，即不会并排，除非设置了定位属性：默认情况下，每个块级元素独占单行文档流向总结内联元素的流向是从左到右，块元素到达最右边会换行。块元素将从上到下开始一个新行，每个内联块也是从左到右。inline的宽度是所有内部行内元素的宽度。宽度，一般由文字宽度之和决定，指定宽度无效，块自动计算宽度，默认width:auto;，指尽可能宽，越宽越好，不一定是100%，可以由width指定，指定不会断行，除非有其他非默认属性。当然，它与它的高度或填充无关。块的高度由内部正常文档流中所有元素的高度之和决定。它们都被包裹起来了。您可以将heightinline-block设置为类似于块。你可以在这里设置高度inline/inline|块级|行框元素指的是显示：[inline|块|inline-block]元素，因为HTML5标准不分块级、行内级，只有浏览器的默认属性，可以随时切换，永远不要写在inline元素里block元素永远不要写width:100%;,除非指定默认的高度由谁决定？在css-demo_flowwithCSSanimation&SCSSdemo中，默认是不连接的它接受宽度，不接受高度；包裹它的不被设置的padding拉伸，的高度由里面的元素决定，包裹元素在里面;带有内边距的仅提高视觉高度。行内元素的实际高度由行高line-height间接决定，包裹起来的被内部元素的实际高度拉伸，行高会继承，也是间接的什么时候写在div之后？它还受不同字体的影响。深入理解CSS请看linebox模型：fontmeasurement...byFangYinghang父元素的高度在文档流外不计算到父元素中。详见stackingcontextmdn属性overflowwhenthecontentisgreaterthanthecontainerbox等。如果内容的宽度或高度大于容器，就会溢出。可以使用overflow设置是否显示滚动条auto:灵活设置scroll:一直显示，太丑了，多余的像素会影响布局，不需要，killhiddenincssReset:直接隐藏overflowPartiallyvisible:直接显示overflowoverflow部分可以分为overflow-x和overflow-y出文档流mdn超出内容...visiblevisiblehidden不显示scrollable（太丑了高度不超过还显示滚动条）autobeyond部分，当滚动条中没有任何内容，即高度为0px，其中没有文档流元素，中也没有任何内容时，border为已添加，并且高度为指定由line-height确定的可见值（默认值）以外的值将创建一个新的块级格式化上下文。要让overflow生效，块级容器必须有指定的高度（height或max-height）或者Setwhite-spacetonowrap注意：将一个轴设置为可见（默认），同时将另一个轴设置为不同的值将导致可见轴的行为变为自动。注意：即使溢出设置为隐藏，您也可以使用JavaScriptElement.scrollTop属性来滚动HTML元素。如果有滚动条，里面的元素默认只显示在首屏，用SCSS的css-demo-overflow留空，让一个元素脱离文档流。回想一下，块的高度是由文档流内部元素决定的，有些元素可以设置高度不在文档流中，让我走哪些元素不在文档流中如何将一个元素从文档流中取出？内联元素的高度由行高决定-->决定行高的文本内容构成文档流元素-->决定其外部块级元素的高度-->其外部块的高度-level元素现在是让文本，也就是它的内联元素，从文档流中分离出来。添加属性float并添加属性position:absolute|固定的;，也就是说，父容器在计算高度的时候，是不会被计算进去的，以后会学习清除float，但是一旦脱离了文档流，就没办法了回到块，内联，内联块？过时概念元素的默认级别是inline/inline|块级|linebox元素指的是展示的元素：[inline|块|inline-block]，因为HTML5标准不分块级，内联级，只有浏览器的默认属性可以随时切换。块级元素和行内元素mdn默认为块级盒元素，默认为行内盒元素。通过显示：[内联|块|行内块|];切换inline-block和文档流中的inline很像，但是不会跨两行显示FlowLayout和Overflow流布局和溢出块级元素。盒子模型（border-box更符合人类的思维和直觉）eg.更符合人类的思维和直觉。CSS不是第三视角的重点，工作和学习市场更需要的技术才是王道。张*旭的职业发展不适合大多数人，选择比努力更重要CSSBasicConcepts.pdf·未完待续·参考文章CSSBasicConcepts.pdf转载-非商用-非衍生-保留签名小知识