我想换一个div
通过媒体查询确定元素的位置[按查看文档的顺序]。
<div>1</div>
<div>2</div>
当我改变视口时我想要div_1
留在div_2
。基本上div_1
在顶端。但我想通过媒体查询更改它。可以吗?
Use flexbox
和它的order
财产
我推荐一个.wrapper
,尽管您可以在body
也得到相同的结果
@media screen and (max-width: 800px) {
.wrapper {
display: flex;
flex-direction: column;
}
.wrapper div:first-child {
order: 1;
}
}
<div class="wrapper">
<div>1</div>
<div>2</div>
</div>
If flexbox
不是一个选项,你可以使用display: table
@media screen and (max-width: 800px) {
.wrapper {
display: table;
width: 100%;
}
.wrapper div:nth-child(1) {
display: table-footer-group;
}
}
<div class="wrapper">
<div>1</div>
<div>2</div>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)