基础中的图像

Question

我正在使用foundation来构建一个流畅的响应式布局。

我有 svg 形式的图像 - 我需要将它们放入我的页面中。

最好的

方法是什么？

将它们作为图像放入并使用 % 宽度调整图像大小，或者我应该将其放入使用以下内容的div 中：

<div class="small-3 meidum-4 columns">

所以它的大小与布局有关。

什么是最佳实践？

Answer 1

我的选择是设置自己的css，因为使用网格列来限制图像宽度并不是一个好的解决方案。

如果你正在设置自己的css，也许你想复制bs样式

// Keep images from scaling beyond the width of their parents.
.img-responsive {
  display: block;
  max-width: 100%; // Part 1: Set a maximum relative to the parent
  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
}

我相信这里有一些关于在基金会中处理图像的文档：http://foundation.zurb.com/docs/components/interchange.html