html - 支持更小的设备宽度

Question

我正在执行以下操作以显示带有图像的新闻项目。它适用于 320 宽度的设备，但我们可以为 240 设备做些什么，因为我将图像向右浮动，它会下降，使用 % 和 div(而不是表格)也是明智的

<div style="padding:10px;height: 100px;border-bottom: red 1px dashed">
  <div style="width: 56%; float: left; padding-right: 10px;">
     <span style="font-size: 14px; display: block; color: #cccccc">
        Pune, the team to beat
      </span> 
      <span style="font-size: 16px"> 
         Ruthless Gayle
      </span>
  </div>
  <div style="width: 40%; float: right">
    <img src="../images/src.jpg" width="120px" height="80px" />
  </div>
</div>

请告知如何更好地做到这一点。我们应该减少小宽度设备的字体吗？还有，关于图像大小的问题。

Answer 1

对于字体大小，使用“em”而不是“px” --> 1em = 16px。

和body-->font-size :100%;