Question

我想将一个SVG文件放在屏幕的中央，这样它占据了屏幕的25％，但它保持了它的比例（即它不比它高很多）。

这是我到目前为止的代码： http://jsbin.com/muyumegugi/1/edit

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
<img src="http://upload.wikimedia.org/wikipedia/commons/8/84/Konqi_svg.svg" alt="Kiwi standing on oval">
</body>
</html>

是不是我应该将SVG放在div中然后约束div的大小，并使svg扩展到div的大小，或者我应该约束svg的大小。

任何帮助都会受到赞赏，不知道如何进步。

詹姆斯

Answer 1

您可以通过text-align;

将svg居中

body {
text-align:center;
}

Answer 2

类似于this？

从HTML中删除<img>：

body { 
    background: url('http://upload.wikimedia.org/wikipedia/commons/8/84/Konqi_svg.svg') no-repeat center center fixed;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-size: 25% 25%;
}

将SVG放置在屏幕中央

2 个答案: