zurb基础，单行响应图像，行为320 - 480屏幕尺寸

Question

我刚刚开始探索zurb基础，我想知道如果设备屏幕大小介于320 - 480 px之间，如何连续显示一个图像。

示例http://jsfiddle.net/8ww2v/

桌面版 第一行：滑块 第二行：4张图片 第三行：3张图片

第二排＆amp;三个可以是以下任何矩阵4x6,4x4,4x3和3x6,3x4,3x3

手机版 使用当前代码，它会打破行中两个图像的行形成，即使对于320px宽的小屏幕也会显示两个图像。

image image

image image

image image

我想要的是，如果屏幕宽度在320 - 480之间，那么它应该连续显示1张图像

image

image

image

image

image

image

image

我不确定如何在基础上实现这一点或者我需要改变什么属性我尝试了一些但是它没有用

我希望有人认为这样会发生在屏幕320 - 480上

   <div class="row">
          <p>
    <div class="large-4 small-6 columns">   
      <img src="http://placehold.it/600x400&text=%5Bimg%5D"/>
      <p>Lorem sorum Lorem sorum  Lorem sorum  Lorem sorum </p>
    </div>
    <div class="large-4 small-6 columns">
       <img src="http://placehold.it/600x400&text=%5Bimg%5D"/>
      <p>Lorem sorum Lorem sorum  Lorem sorum  Lorem sorum </p>
    </div>
    <div class="large-4 small-6 columns">  
       <img src="http://placehold.it/600x400&text=%5Bimg%5D"/>
      <p>Lorem sorum Lorem sorum  Lorem sorum  Lorem sorum </p>
    </div>
          </p>
  </div>

Answer 1

您可以尝试以下代码：

Working Demo

@media all and (max-width: 320px){
 .columns {
    float:none !important;
 }
 .small-6{
    width:100%;

     }
}