文档流 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>文档流</title>
    </head>
    <body>
        <!-- 
            文档流（标准流、常规流）
                文档流是网页中的一个位置，默认情况页面中的所有元素都在文档流中排列
                块元素在文档流中的特点
                    1.自上向下进行排列（独占一行）
                    2.默认宽度和元素一样
                    3.默认高度被内容撑开
         -->
         <div>
             我是一个div
         </div>
         <div>
             我是另一个div
         </div>
         <!-- 
            行内元素在文档流中的特点
                1.自左向右水平排列，如果一行中不足以容纳所有的元素则切换到下一行，进行从左向右排列
                2.默认高度和宽度都被内容撑开
          -->
          <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dignissimos inventore magnam ut minus amet rerum ipsam natus? Magnam eligendi at nesciunt eaque eos et id quasi rem fuga aspernatur deleniti.</span>
          <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dignissimos inventore magnam ut minus amet rerum ipsam natus? Magnam eligendi at nesciunt eaque eos et id quasi rem fuga aspernatur deleniti.</span>
          
    </body>
</html>

 

posted @ 2022-05-09 15:23  氯丙嗪  阅读(16)  评论(0)    收藏  举报