浏览器放大缩小布局会乱的解决办法

y叽里咕噜

于 2022-11-18 17:39:33 发布

阅读量3.5k

点赞数 1

文章标签： html 前端 css3

本文链接：https://blog.csdn.net/qq_54030660/article/details/127926789

版权

给他固定的宽和高，不能用百分比。

但凡换成，就是不能跟随浏览器的放大缩小而放大缩小了

这是用的下面的固定宽值

这是用的百分比宽值

<style>
    .box {
        display: flex;
    }

    .one {
        display: flex;
        width: 200px;
        height: 100px;
    }

    .photo img {
        width: 100px;
    }

    .text {
        width: 100px;
        height: 100px;
        font-size: 14px;
        overflow: hidden;
    }
</style>

<body>
    <div class="box">
        <div class="one">
            <div class="photo">
                <img src="imgs/loginh.jpg" alt="">
            </div>
            <div class="text">
                创业谷和饿会儿玩女的就开始拿我是彔欧文创业谷和饿会儿玩女的就开始拿我是彔欧文创业谷和饿会儿玩女的就开始拿我是彔欧文创业谷和饿会儿玩女的就开始拿我是彔欧文创业谷和饿会儿玩女的就开始拿我是彔欧文
            </div>
        </div>
        <div class="one">
            <div class="photo">
                <img src="imgs/loginh.jpg" alt="">
            </div>
            <div class="text">
                创业谷和饿会儿玩女的就开始拿我是彔欧文
                创业谷和饿会儿玩女的就开始拿我是彔欧文
                创业谷和饿会儿玩女的就开始拿我是彔欧文
                创业谷和饿会儿玩女的就开始拿我是彔欧文
                创业谷和饿会儿玩女的就开始拿我是彔欧文
            </div>
        </div>
        <div class="one">
            <div class="photo">
                <img src="imgs/loginh.jpg" alt="">
            </div>
            <div class="text">
                创业谷和饿会儿玩女的就开始拿我是彔欧文
                创业谷和饿会儿玩女的就开始拿我是彔欧文
                创业谷和饿会儿玩女的就开始拿我是彔欧文
                创业谷和饿会儿玩女的就开始拿我是彔欧文
                创业谷和饿会儿玩女的就开始拿我是彔欧文
            </div>
        </div>
    </div>
</body>