master

分支 (1)

管理

管理

master

tool-box
/
pubu1.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div class="home">
        <div>
            <img class="main_img img-hover"
            src="https://img2.baidu.com/it/u=4201222864,4041053760&amp;fm=253&amp;fmt=auto&amp;app=138&amp;f=GIF?w=485&amp;h=422"
            style="width: 275px; height: 240px; background-color: rgb(255, 255, 255);">
        </div>
        <div>
            <img class="main_img img-hover"
            src="https://img1.baidu.com/it/u=3137752502,1535259864&fm=253&fmt=auto&app=138&f=PNG?w=500&h=288"
            style="width: 416px; height: 240px;; background-color: rgb(255, 255, 255);">
        </div>
        <div>
            <img class="main_img img-hover"
            src="https://img0.baidu.com/it/u=1608484515,4031396427&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=422"
            style="width: 275px; height: 240px; background-color: rgb(255, 255, 255);">
        </div>
        <div>
            <img class="main_img img-hover"
            src="https://img2.baidu.com/it/u=4201222864,4041053760&amp;fm=253&amp;fmt=auto&amp;app=138&amp;f=GIF?w=485&amp;h=422"
            style="width: 271px; height: 240px;; background-color: rgb(255, 255, 255);">
        </div>
        <div>
            <img class="main_img img-hover"
            src="https://img2.baidu.com/it/u=4201222864,4041053760&amp;fm=253&amp;fmt=auto&amp;app=138&amp;f=GIF?w=485&amp;h=422"
            style="width: 275px; height: 240px; background-color: rgb(255, 255, 255);">
        </div>
        <div>
            <img class="main_img img-hover"
            src="https://img2.baidu.com/it/u=4201222864,4041053760&amp;fm=253&amp;fmt=auto&amp;app=138&amp;f=GIF?w=485&amp;h=422"
            style="width: 275px; height: 240px; background-color: rgb(255, 255, 255);">
        </div>
        <div>
            <img class="main_img img-hover"
            src="https://img2.baidu.com/it/u=4201222864,4041053760&amp;fm=253&amp;fmt=auto&amp;app=138&amp;f=GIF?w=485&amp;h=422"
            style="width: 275px; height: 240px; background-color: rgb(255, 255, 255);">
        </div>
        <div>
            <img class="main_img img-hover"
            src="https://img2.baidu.com/it/u=4201222864,4041053760&amp;fm=253&amp;fmt=auto&amp;app=138&amp;f=GIF?w=485&amp;h=422"
            style="width: 275px; height: 240px; background-color: rgb(255, 255, 255);">
        </div>

    </div>
</body>
<style>
    .home{
        column-count: 4;
        column-gap: 10px;
    }
    .home div{
        text-align: center;
        box-sizing: border-box;
        border: 1px solid red;
        break-inside:avoid /*控制文本块分解成单独的列，以免项目列表的内容跨列*/
    }
</style>
</html>