如何在不改变屏幕大小的情况下将html元素放到屏幕外

【问题标题】：How to put html elements outside the screen without changing the size of the screen如何在不改变屏幕大小的情况下将html元素放到屏幕外
【发布时间】：2022-12-31 07:55:18
【问题描述】：

我想在屏幕外隐藏一个 div，但当我尝试时屏幕尺寸会发生变化。

例如：

<!DOCTYPE html>
<html lang="en">
<head></head>
<body style="margin: 0px;">
    <div style="height: 100px; width: 1000px; background-color: black; float: right;"></div>
    <div style="height: 100px; width: 1000px; background-color: gray; float: right; transform: translateX(50px);"></div>
</body>
</html>

When I tried this code

我不希望滑块出现。

【问题讨论】：

溢出：藏在身上？

标签： html css

【解决方案1】：

在 body 标签中使用 css overflow: hidden 属性，您可以轻松摆脱该滑块。我附上了下面的代码，运行探索。但是，您可以探索有关溢出属性的更多信息。阅读我在下面链接的文章以清楚地探索。

W3 School - css overflow

<!DOCTYPE html>
<html lang="en">
<head></head>
<body style="margin: 0px; overflow: hidden">
    <div style="height: 100px; width: 1000px; background-color: black; float: right;"></div>
    <div style="height: 100px; width: 1000px; background-color: gray; float: right; transform: translateX(50px);"></div>
</body>
</html>

【讨论】：