<tspan>

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

Attributes

Global attributes

• Conditional processing attributes »
• Core attributes »
• Graphical event attributes »
• Presentation attributes »
• class
• style
• externalResourcesRequired

Specific attributes

• x
• y
• dx
• dy
• rotate
• textLength
• lengthAdjust

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="http://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

Browser compatibilityUpdate compatibility data on GitHub

See also

• <text>