浮动元素具有行内块元素

代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>浮动元素具有行内块元素特点</title>

    <style>
          
          span,
          div{
                float: left;
                width:  200px;
                height: 100px;
                background-color: pink
          }

          p{
                float: right;
                height: 200px;
                background-color: purple;
          }
    </style>
</head>

<body>
        <span>1</span>    
        <span>2</span>    


        <div>div</div>

        <p>ppppp</p>
      
</body>

</html>

运行效果

猜你喜欢

转载自blog.csdn.net/weixin_42900834/article/details/123908035
今日推荐