HTML标签4(浮动)

2019-12-06  本文已影响0人  Dxes
通过设置标签的float属性,可以让标签浮动
left:左浮动,浮动后标签靠左显示
right:右浮动,浮动后标签靠右显示

2.什么时候使用浮动
浮动可以让竖着显示的横着显示;还可以让标签靠右显示
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <h1>==========1.浮动会导致脱流==========</h1>
        <div id="" style="height: 250px;">
            
            <p style="background-color: chartreuse; height: 40px; float: left;">我是段落1</p>
            <p style="background-color: red; float: left;">我是段落1</p>
            
            <a style="background-color: yellow; height: 40px; float: left;">这是链接1</a>
        </div>

        <h1>==========2.浮动会导致脱流==========</h1>
        <div id="" >
            <p style="background-color: rosybrown; float: left;">我是段落1</p>
            <p style="background-color: red;float: right;">我是段落2</p>
            <p style="background-color: yellow; float: left;">我是段落3</p>
            <p style="background-color: #0000FF; float: right;">我是段落4</p>
            <p style="background-color: palevioletred; float: left;">我是段落5</p>
            
            
        </div>
        
        
        
    </body>
</html>
上一篇 下一篇

猜你喜欢

热点阅读