前端布局

左右布局

.body {
        width: 60%;
        margin: 0 auto;
        display: flex;
        justify-content: space-between; 
    }
    .content {
        border: 1px solid red;
        
    }
    
    <div class="body">
        <div class="content">1</div>
        <div class="content">2</div>
    </div>

效果：

左右布局居中展示

<div class="body">
        <div class="content">1</div>
        <div class="content">2</div>
</div>
.body {
        width: 60%;
        margin: 0 auto;
        display: flex;
        justify-content: space-evenly;
        border: 1px solid green;
    }
    .content {
        border: 1px solid red;
    }
    

效果：