Unsere Freiwilligen haben diesen Artikel noch nicht in Deutsch übersetzt. Machen Sie mit und helfen Sie, das zu erledigen!
Within a <text>
element, text and font properties and the current text position can be adjusted with absolute or relative coordinate values by including a <tspan>
element.
Usage context
Categories | Text content element, Text content child element |
---|---|
Permitted content | Character data and any number of the following elements, in any order: Descriptive elements <a> , <altGlyph> , <animate> , <animateColor> , <set> , <tref> , <tspan> |
Attributes
Global attributes
- Conditional processing attributes »
- Core attributes »
- Graphical event attributes »
- Presentation attributes »
class
style
externalResourcesRequired
Specific attributes
DOM Interface
This element implements the SVGTSpanElement
interface.
Example
SVG
<?xml version="1.0"?> <svg width="250" height="40" viewBox="0 0 250 40" xmlns="https://www.w3.org/2000/svg" version="1.1"> <style> <![CDATA[ text{ font: 20px Verdana, Helvetica, Arial, sans-serif; } tspan{ fill: red; font-weight: bold } ]]> </style> <text x="15" y="30"> You are <tspan>not</tspan> a banana </text> </svg>
Result
Specifications
Specification | Status | Comment |
---|---|---|
Scalable Vector Graphics (SVG) 2 The definition of '<tspan>' in that specification. |
Candidate Recommendation | |
Scalable Vector Graphics (SVG) 1.1 (Second Edition) The definition of '<tspan>' in that specification. |
Recommendation | Initial definition |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | IE | Opera | Safari |
---|---|---|---|---|---|
Basic support | 1.0 | 1.5 (1.8)[1] | 9.0 | 9.0 | 3.0.4 |
Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | 3.0 | 1.0 (1.8)[1] | No support | (Yes) | 3.0.4 |
The chart is based on these sources.
[1] Various presentation attributes don't work. The attribute rotate
was implemented in Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1).