如何转换下面的HTML,类似的图像?不要将元素 Package 在另一个div中。我的目的是改变每个元素的位置,左,右或顶部使用css只。这可能吗?
<div class="container">
<div class="left">1</div>
<div class="left">2</div>
<div class="left">3</div>
<div class="left">4</div>
<div class="right">5</div>
<div class="center">6</div>
<main class="main-content"></main>
</div>
2条答案
按热度按时间nqwrtyyt1#
**编辑2:仅仅使用HTML和CSS来移动和排列元素几乎是不可能的。可能有一个解决方案,但最有效的方法是使用jQuery appendTo()函数。
这篇文章可能对你很有用:How to move an element into another element?
**编辑:我最近知道你在找什么了。我会尽快为您的问题找到答案。
根据你的例子,你可以通过创建3列(在我的代码中,我使用了div和**“column”class)并应用display来实现这一点:内联块;**,以确保合并后的列的总和不会高于99%。
显示:inline-block将尝试使用父容器的整个宽度,而不会溢出内容。当宽度大于99%时,将最后一列发送到下一行。
HTML
CSS
下面是一个代码Pen来看看它是如何工作的:https://codepen.io/ialexandru/pen/NWPzRZj
xcitsw882#