Css 英雄图像上方的内容框，在断点处位于英雄图像下方

所以我最近开始使用Bootstrap（一般来说对CSS来说比较新）。 我试着让预订表放在英雄形象的上方，然后当它调整到平板电脑或手机时，它就会出现在英雄形象的下方

我已经能够做到这一点，每种类型的预订表单有2块代码，然后它们的可见性由css媒体查询触发。这似乎不是一个简单的解决方案，因为我在重复代码

另一种方法是让英雄形象成为自己的div，没有孩子，并单独让预订表单位于绝对位置的顶部，该位置再次更改为与CSS媒体查询不同的样式

我想在这里问一下，是否有更好的解决方案，也许可以在引导中完成

---

非常感谢任何人提供的帮助

我觉得这是一个很好的方法，Bootstrap并没有阻止你在必要时添加或覆盖样式。我没有直接回答你的问题，但我最近给出了一个关于如何创建响应性“登录表单”的答案。我展示了一个包含一些元素的

，并使用简单的数学方法（使用CSS

calc（）

）调整大小，而不使用“@media querys”或外部框架。使用指向所用数学的链接进行了大量注释：。看一看，也许这也适合你！