如何交换2个元素的边(一个用浮点数:左边,另一个用浮点数:右边)

时间:2015-04-19 09:56:30

标签: css css3 responsive-design

我的网站一边是图片,另一边是文字。 这是它的样子: enter image description here

正如您在图片中看到的那样 - 左侧有一些文字,右侧有图像。 然后你左边有一个图像,右边有文字,(旋转)等等。

这是我使用jsfiddle创建的一个简单示例:http://jsfiddle.net/fyawuuh1/1/

当在移动设备上显示页面时 - (使用@media查询)我想组织图像始终在顶部,并在图像下面有文本(没有旋转),这意味着我将:< / p>

  • 图片
  • 文本
  • 图片
  • 文字
  • 图像
  • 文本

我很难找到让它看起来像这样的方法。. enter image description here

1 个答案:

答案 0 :(得分:2)

除了更改html结构之外,你可以使用flexbox来实现它与css:

#container {
  display: flex;
  flex-flow: column;
}
#divA {
  order: 2;
}
#divB {
   order: 1;
}