Question

我正在学习在我的网站中使用svgs。

虽然让自己成为形状的代码，但它很容易使其响应，当我尝试使用相同的tecnique和Sketch.app导出的SVG时，它不起作用。任何人都可以告诉我为什么？

以下是两个例子：

首先：手写的形状：here

第二种：用草图创建的形状：here

为了实现我的目标，我使用了这个css代码：

 .svg-container {
  display: inline-block;
  position: relative;
  width: 100%;
  max-width:1102px;
  padding-bottom: 31%; /** height/width **/
  vertical-align: middle;
  overflow: hidden;
}

.svg-content {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}

Answer 1

Sketch SVG具有硬编码的宽度和高度：

<svg class="svg-content" width="1102px" height="348px"

要使其响应，请将宽度和高度都更改为"100%"。或者你可以完全删除它们，这是相同的，因为它们默认为100％。

使草图导出的SVG响应的正确方法是什么？

1 个答案: