我需要在文本中包装文本。这是我在参考中找到的代码,但它本身不起作用。谁能帮我?
<svg xmlns:svg="http://www.w3.org/2000/svg" version="1.2"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="600px" height="400px" viewBox="0 0 300 310">
<title>Basic textflow</title>
<rect x="0" y="0" width="100%" height="100%" fill="yellow"/>
<flowRoot font-size="16" fill="black" color="black">
<flowRegion>
<path d="M100,50L50,300L250,300L300,50z"/>
<flowText>Tomorrow, and tomorrow, and tomorrow; creeps in this
petty pace from day to day, until the last syllable of recorded time.
And all our yesterdays have lighted fools the way to dusty death.
</flowText>
</flowRegion>
</flowRoot>
<path d="M90,40L40,270L260,270L210,40z" fill="none" stroke="black" stroke-width="5"/>
</svg>
我的要求:
答案 0 :(得分:0)
这不是你想要的答案,但它是我发现的最好的答案。 FireFox和较小程度的Chrome都支持foreignObject标记。有了它,您可以添加文本。这通常效果很好,但您只能使用矩形进行包装。 xmlns属性是必需的。
<foreignObject x="225" y="630" width="157" height="125">
<div class="plain-text" xmlns="http://www.w3.org/1999/xhtml">
You can put really long lines of text here and they will wrap as you would hope they would. The problem is that Chrome doesn't support <ul><li> tags in side the foreignObject.
</div>
</foreignObject>
任何浏览器都不支持所需的流域。这是Stackoverflow答案的链接,提供了更多细节。