gpt4 book ai didi

html - Bootstrap - 根据方向更改网格

转载 作者:行者123 更新时间:2023-11-28 03:03:09 25 4
gpt4 key购买 nike

我希望创建一个页面,该页面在横向模式下显示为两栏,但在纵向模式下切换为一栏。以下是我的愿望:
横向:

<body>
<div class="container-fluid">
<div class="row">
<div class="col-xs-6">image goes here</div>
<div class="col-xs-6">text goes here</div>
</div>
</div>
</body>

纵向:

<body>
<div class="container-fluid">
<div class="row">
image goes here
</div>
<div class="row">
text goes here
</div>
</div>
</body>

如何使用 Bootstrap 实现这一目标?

最佳答案

如果 Bootstrap 列不起作用,您可以使用媒体

@media screen and (orientation:portrait) { … }//定义宽度 100%

@media screen and (orientation:landscape) { … }//定义宽度 50%

关于html - Bootstrap - 根据方向更改网格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33782798/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com