正如标题所述,我在我建立的网站上有SVG文本,但Chrome和Firefox之间的显示方式存在很大差异。如何在浏览器中获得更统一的大小?
HTML ...
<h1 class="stroke">
<svg xmlns="http://www.w3.org/2000/svg" width="540" height="72" viewBox="0 0 540 72">
<text x="0" y="64">Entrepreneurs Associates</text>
</svg>
</h1>
CSS ......
h1, h2, h3 {
font-family: acre, Arial, sans-serif;
font-weight: bold;
}
h1 {
position: absolute;
margin: 0 0 0 210px;
font-variant: small-caps;
font-size: 40pt;
}
.stroke text {
fill: #fff;
stroke: #141414;
fill-opacity: 1;
stroke-width: 2px;
stroke-linecap: square;
stroke-linejoin: round;
stroke-opacity: 1;
}
该网站也可以在https://eanagaland.github.io/找到(虽然这是临时地址)。