javascript - SVG 和响应问题

标签 javascript css svg responsive-design raphael

我的主页有问题 -> http://novustest.altervista.org/

map 在大屏幕上显示正确，但我想让它更灵活，如果我缩小我的浏览器窗口，我希望 map 自动调整大小。我该怎么做？

这是我的代码，非常简单。我只有一个html页面和2个js文件。

这是我的 HTML 页面:

!DOCTYPE html>
<style>
.italy{
    width: 100%;
    height: auto;
    overflow: hidden;
    display: inline-block;
    position: relative;
    vertical-align: middle;
}
</style>

<html>
    <head>
        <meta charset="UTF-8">
    </head>
    <body>
        <div id="myMap" class="italy">

        </div>
        <script src="raphael-min.js"></script>
        <script src="map.js"></script>
    </body>
</html>

这是 jsfiddle 的链接，但它不起作用...

https://jsfiddle.net/ye0b2qvp/1/

最佳答案

您的 SVG 中嵌入了样式，使其成为 1920x1080。

参见 this article以获得有关此事的更多说明。

关于javascript - SVG 和响应问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29833238/