html - 将一个盒子推到视线之外

标签 html css

因此,我正在尝试使用我的 CSS 代码进行试验,并想知道如何将框推出视野之外。让我更详细一点...

我已经使用网格元素并排排列了两个盒子,并希望盒子一将盒子二推出左边距,因此它不可见。 (稍后我将通过动画将其带回 View )。所以在起点只有盒子一是可见的。

有谁知道如何在不调整宽度的情况下实现这一点?

(我可以通过简单地调整第一个框的宽度来做到这一点,但我正在寻找不同的方法。)

最佳答案

没有问题的代码,很难回答,但让我试试。

要隐藏元素,您可以使用 display: none;visibility: hidden;opacity: 0;

你也可以告诉父元素它有 position: relative; 以及要隐藏的元素, position: absolute; left: 150%;right: -50%;,具体取决于您要隐藏的元素,分别是左侧或右侧。并使用 javascript 或 css 动画稍后更改其 left 或 right 属性以显示它。

您可以通过多种方式实现自己的目标。

关于html - 将一个盒子推到视线之外,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52429014/

相关文章:

javascript - 通过 JQuery 在多个选择框中反转所选选项在放置 div 时不起作用

javascript - 在 div 加载页面内的 onClick

javascript - 将 ajax 元素包装到 HTML 页面

javascript - 如何使用从 Node js Controller 发送的变量替换悬停时 EJS 模板中的文本?

html - 如何调整到合适的img标签?

javascript - Div 不包含在单元格中

javascript - 无法使用 jquery 更改悬停在 <a> 上的跨度

html - 向 :after image 添加工具提示

css - Typekit 和 IE11

css - 高度为 100% 但宽度不是 100% 的 2 列布局