css10.文档流

时光无错孤独难谈

于 2020-02-13 10:50:52 发布

阅读量70

点赞数

分类专栏： html5 && css

本文链接：https://blog.csdn.net/qq_43745403/article/details/104291963

版权

html5 && css 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <style type="text/css">


        
        </style>


    </head>
        
    <body>
        <!-- 
            文档流：
                文档流处在网页的最底层，他表示的是一个页面中的位置，
                我们所创建的元素默认在文档流中
            元素在文档流的特点
                块元素：
                    1.块元素只有在文档流中会独占一行，块元素会自上向下排列
                    2.块元素在文档流中的默认宽度是父元素的100%（auto）
                    3.块元素在文档流中的默认高度被内容撑开
                内联元素：
                    1.内联元素在文档流中只占自身的大小，会默认从左向右排列
                        如果一行不足以容纳内联元素，会换到下一行，依旧自左向右
                    2.内联元素的宽度高度默认都被内容撑开
         -->
         <!-- 
             当元素的宽度为auto时，此时指定内边距不会影响可见框的大小
                而是会自动修改宽度，以适应内边距

          -->
        <div style="width: 100px; height: 100px ; background-color: pink;"></div>
        <div style="width: 100px; height: 100px ; background-color: rgb(255, 236, 192);"></div>

         <span style="background-color: pink;">我是一个span</span>
         <span style="background-color: rgb(255, 236, 192);">我是一个span</span>
    </body>


</html>