所以我最近刚进入SVG并且我遇到了一些问题,而不是调整大小以适应容器,而是我的SVG图像被裁剪掉了.
HTML:
<!DOCTYPE html>
<html>
<head>
<title>Eye</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="js/snap.svg.js"></script>
<script src="js/eye.js"></script>
</head>
<body>
<svg id="svg"></svg>
</body>
</html>
JS:
window.onload = function() {
var s = Snap("#svg");
var circle = s.circle(90,120,80);
var square = s.rect(210,40,160,160);
var ellipse = s.ellipse(460,120,50,80);
}
现在,使用CSS代码肯定不会被裁剪,因为Google Chrome上的用户代理样式表包含有关SVG的"溢出:隐藏".但这真的是解决问题的正确方法吗？另外,为什么它被裁剪而不是缩放？我应该使用百分比而不是像素来"绘制"我的svgs吗？
