html – Bootstrap行 – 使底行显示在顶部

概述我遇到了bootstrap行的问题.我想正确使用图像&留在现代网站.但是在较小的屏幕上,我需要将图像放在顶部. 但是,这发生了： 我想过使用flex,但它没有响应行,我需要图像流畅. <div class="container"> <div class="row"> <div class="col-md-7 col-sm-12 col-xs-12 "> // Text 我遇到了bootstrap行的问题.我想正确使用图像&留在现代网站.但是在较小的屏幕上,我需要将图像放在顶部.

但是,这发生了：

我想过使用flex,但它没有响应行,我需要图像流畅.

<div >  <div >    <div >      // Text Data    </div>    <div >      <img  src="url"></img>    </div>  </div></div>

解决方法 你有正确的想法！ bootstrap v4网格系统可以处理flex修饰符.

https://v4-alpha.getbootstrap.com/layout/grid/#flex-order

在您的情况下,flex-first修饰符将在文本之前移动内容.您也可以将它们与断点一起使用,即flex-md-first

<div >  <div >    <div >      // Text Data    </div>    <div >      <img  src="url"></img>    </div>  </div></div>

Codepen：https://codepen.io/sidhuko/pen/gxwprN

总结

以上是内存溢出为你收集整理的html – Bootstrap行 – 使底行显示在顶部全部内容，希望文章能够帮你解决html – Bootstrap行 – 使底行显示在顶部所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。