我没有很多在网络上使用SVG的经验。
我正在使用一些SVG，基本上是通过CMS上传的，所以我无法控制它。 我有一些我正在使用的演示SVG代码，但我无法集中（水平）它！
svg {
margin:0 auto;
}
上面的代码不起作用。
有人能指出我正确的方向吗？ 或者告诉我我做错了什么？
谢谢！
答案 0 :(得分：2)
您需要将display: block添加到SVG。 margin: 0 auto;依赖于display: block元素，但svg元素默认为display: inline。此外，WebKit还需要指定宽度。值得庆幸的是，您可以使用max-width: 100%;，而不是指定实际宽度。
工作示例：
svg {
max-height: 300px;
margin: 0 auto; /* poor attempt at centering */
height: auto !important; /* overrides inline */
width: auto !important; /* overrides inline */
display: block;
max-width: 100%;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" height="956.33856" id="svg2" preserveAspectRatio="xMinYMax meet" version="1.0" viewBox="0 0 956.69287 956.33856" width="956.69287">
<defs id="defs4"></defs>
<g id="layer1" transform="translate(-94.745154,-7.9548642)">
<g id="g3183" transform="matrix(1.8024688,0,0,1.8024688,-40.596978,-681.7136)">
<path d="M 477.07432,781.88185 C 474.87432,780.86648 472.12738,778.96386 470.97001,777.65381 C 469.81264,776.34375 459.1703,759.29689 447.32037,739.77189 C 435.47043,720.24689 413.34449,683.79689 398.1516,658.77189 C 382.95871,633.74689 369.33767,611.9944 367.8826,610.43302 C 360.72593,602.75345 347.60401,604.42017 342.18608,613.69695 C 339.13239,618.92558 339.59609,625.03813 343.62244,632.63129 C 346.53405,638.12221 346.99706,639.96586 347.01281,646.13129 C 347.05436,662.39623 336.40264,673.18281 318.99975,674.49898 C 312.90798,674.9597 310.78459,675.56552 308.48784,677.49812 C 306.90486,678.8301 295.30868,692.5991 282.71853,708.0959 C 270.12839,723.59269 258.86346,737.13545 257.68535,738.1909 C 254.68025,740.88313 245.90297,741.51032 241.69367,739.33361 C 235.15616,735.95293 232.29502,727.43828 235.37166,720.51954 C 236.41053,718.18333 255.4961,683.42189 277.78403,643.27189 C 300.07196,603.12189 319.04257,568.83174 319.94093,567.07155 C 323.18851,560.70848 321.20847,553.34878 315.27577,549.73141 C 308.31973,545.49006 302.25263,547.90741 293.44096,558.43116 C 289.98636,562.55698 285.11562,567.60443 282.61709,569.64771 C 270.5082,579.5503 268.33621,579.98408 232.83205,579.5906 L 204.07432,579.27189 L 198.07432,576.46963 C 190.30875,572.84277 185.03101,567.71738 181.51041,560.38387 C 177.74221,552.5346 176.96344,545.705 178.95166,537.94422 C 180.89453,530.36044 184.01325,525.31598 190.03728,520.01341 C 199.35517,511.81148 192.90255,512.31442 293.07432,511.9822 C 355.15192,511.77632 384.04056,512.02376 388.57432,512.80018 C 402.46662,515.17929 415.55343,524.75073 422.35057,537.50347 C 425.04981,542.56777 442.35775,590.01676 466.58558,658.77189 C 469.78342,667.84689 479.13073,694.17189 487.3574,717.27189 C 495.58407,740.37189 502.62581,760.69673 503.00572,762.43821 C 504.57206,769.61811 499.60574,778.48997 492.11569,781.89223 C 486.97843,784.22576 482.14567,784.22243 477.07432,781.88185 z" id="path2396" style="fill:#000000"></path>
<path d="M 340.47111,402.24003 C 204.9164,402.24003 94.745156,512.38623 94.745156,647.9101 C 94.745156,783.43398 204.9164,893.58018 340.47111,893.58018 C 476.02582,893.58018 586.19708,783.43398 586.19708,647.9101 C 586.19708,512.38623 476.02582,402.24004 340.47111,402.24003 z M 340.47111,418.20661 C 467.38135,418.20662 570.22686,521.02874 570.22686,647.9101 C 570.22686,774.79147 467.38135,877.6136 340.47111,877.6136 C 213.56087,877.61359 110.71533,774.79147 110.71537,647.9101 C 110.71537,521.02874 213.56087,418.20661 340.47111,418.20661 z" id="path2406" style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:38.01576614;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1"></path>
</g>
</g>
</svg>
</body>
</html>
答案 1 :(得分：1)
您还必须设置max-width并设置display: block;
这里是CSS：
svg {
max-height: 300px;
margin: 0 auto; /* poor attempt at centering */
height: auto !important; /* overrides inline */
width: auto !important; /* overrides inline */
max-width: 300px;
display: block;
}