O elemento SVG<tspan> define um subtexto dentro de um elemento<text> ou outro elemento<tspan>. Permite o ajuste do estilo e / ou posição desse subtexto, conforme necessário.

html,body,svg {  height: 100%;}

<svg viewBox="0 0 240 40" xmlns="https://www.w3.org/2000/svg">  <style>    text {      font: italic 12px serif;    }    tspan {      font: bold 10px sans-serif;      fill: red;    }  </style>  <text x="10" y="30">    You are    <tspan>not</tspan>    a banana!  </text></svg>

Attributes

x

The x coordinate of the starting point of the text baseline.Value type:<length>|<percentage> ;Default value: none; Animatable:yes

y

The y coordinate of the starting point of the text baseline.Value type:<length>|<percentage> ;Default value: none; Animatable:yes

dx

Shifts the text position horizontally from a previous text element.Value type:<length>|<percentage> ;Default value:none;Animatable:yes

dy

Shifts the text position vertically from a previous text element.Value type:<length>|<percentage> ;Default value: none; Animatable:yes

rotate

Rotates orientation of each individual glyph. Can rotate glyphs individually.Value type:<list-of-number> ;Default value: none;Animatable:yes

lengthAdjust

How the text is stretched or compressed to fit the width defined by thetextLength attribute.Value type:spacing|spacingAndGlyphs;Default value:spacing;Animatable:yes

textLength

A width that the text should be scaled to fit.Value type:<length>|<percentage> ;Default value:none;Animatable:yes

Global attributes

Core Attributes

Most notably:id,tabindex

Styling Attributes

class,style

Conditional Processing Attributes

Most notably:requiredExtensions,systemLanguage

Event Attributes

Global event attributes,Graphical event attributes

Presentation Attributes

Most notably:clip-path,clip-rule,color,color-interpolation,color-rendering,cursor,display,dominant-baseline,fill,fill-opacity,fill-rule,filter,mask,opacity,pointer-events,shape-rendering,stroke,stroke-dasharray,stroke-dashoffset,stroke-linecap,stroke-linejoin,stroke-miterlimit,stroke-opacity,stroke-width,text-anchor,transform,vector-effect,visibility

Aria Attributes

aria-activedescendant,aria-atomic,aria-autocomplete,aria-busy,aria-checked,aria-colcount,aria-colindex,aria-colspan,aria-controls,aria-current,aria-describedby,aria-details,aria-disabled,aria-dropeffect,aria-errormessage,aria-expanded,aria-flowto,aria-grabbed,aria-haspopup,aria-hidden,aria-invalid,aria-keyshortcuts,aria-label,aria-labelledby,aria-level,aria-live,aria-modal,aria-multiline,aria-multiselectable,aria-orientation,aria-owns,aria-placeholder,aria-posinset,aria-pressed,aria-readonly,aria-relevant,aria-required,aria-roledescription,aria-rowcount,aria-rowindex,aria-rowspan,aria-selected,aria-setsize,aria-sort,aria-valuemax,aria-valuemin,aria-valuenow,aria-valuetext,role

Usage notes

Especificações

Compatibilidade com navegadores