可以在tspan元素上使用svg剪辑路径属性 [英] Can svg clip-path property be used on tspan element

问题描述

即使经过大量搜索，我也无法在网上找到任何有关此内容的信息.当我尝试在tspan元素上使用clip-path时，它对我不起作用.我是在做错什么还是剪切路径对嵌套在文本元素内的tspan元素不起作用? 这是我正在尝试的svg代码.

Even after a lot of search I can't find any mention of this over the net. And When I tried to use clip-path on a tspan element, it didn't work for me. Am I doing something wrong or clip-path doesn't work for tspan elements that are nested inside a text element? This is my svg code I am trying.

 <svg width="500px" height="500px">
    <defs>
    <clipPath id="clipPath841">
    <rect width="10" y="0" x="0" height="100%"></rect>
    </clipPath>
    </defs>
    <text y="130" x="125"  __internalID="internal281">
    <tspan textLength="30" clip-path="url(#clipPath841)">
Hello world how are you what are you doing
</tspan>
    </text>
    </svg>

推荐答案

每个 SVG 1.1规范，您无法在tspan上设置clipPath.

Per the SVG 1.1 specification you cannot set a clipPath on a tspan.

适用于:容器元素，图形元素和"clipPath"

Applies to: container elements, graphics elements and ‘clipPath’

tspan不是图形元素.

即将发布的SVG 2规范可能会对此进行更改.

The upcoming SVG 2 specification may change this.

这篇关于可以在tspan元素上使用svg剪辑路径属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！