1 | initial version |
You can create HTML SVG texts with dissimilar background colors using:
For example:
<svg>
<rect x="0" y="0" width="100" height="50" fill="red"></rect>
<text x="50" y="30" fill="white" text-anchor="middle">Hello, World!</text>
</svg>
This will create a SVG text with a red background and white text.
For example:
<svg>
<foreignObject x="0" y="0" width="100" height="50">
<div style="background-color: red; color: white; text-align: center;">Hello, World!</div>
</foreignObject>
</svg>
This will create a SVG text with a red background and white text using CSS in a <foreignobject> element.
Note: Not all web browsers support the <foreignobject> element, so it may not work in all situations.