主页 / 问题 / 1245043
Accepted
Krovorgen
Asked:2022-02-17 15:41:08 +0000 UTC2022-02-17 15:41:08 +0000 UTC

在页面边框外放置块

  • 772

我想移动图片如下图所示在此处输入图像描述

但是出现了底部滚动，告诉我如何修复它，为图片和父级注册了以下样式：

.top__image {
    width: 523px;
    height: auto;
    transform: translateX(141%);
    position: absolute;
}
.top__image-img {
    position: absolute;
}
html

1 个回答

  1. Best Answer

    使用overflow: hidden;（在这种情况下 - overflow-x）body删除滚动条。

    我设置的高度和宽度值仅作为示例。设置问题的值translateX。

    相比：

    没有overflow: hidden; 

    body {
}

#parent {
    position: absolute;
    width: 523px;
    height: 523px;
    transform: translateX(141%);
    background: #0f0;
}

#child {
    position: absolute;
    width: 100px;
    height: 100px;
    background: #00f;
}
    <body>
    <div id='parent'>
        <div id='child'>
            Ребёнок
        </div>
    </div>
</body>

    从overflow: hidden;

    body {
    overflow-x: hidden;
}

#parent {
    position: absolute;
    width: 523px;
    height: 523px;
    transform: translateX(141%);
    background: #0f0;
}

#child {
    position: absolute;
    width: 100px;
    height: 100px;
    background: #00f;
}
    <body>
    <div id='parent'>
        <div id='child'>
            Ребёнок
        </div>
    </div>
</body>

    • 1

相关问题