SVG <desc> Element
The <desc> element in SVG is used to provide an accessible text description to any of the available SVG elements whether it is a container or graphic element.
Syntax:
<desc></desc>
Property Values: It does not have any property values.
Below given are a few examples of the function given above.
Example1: When text inside the desc is given in a circle element.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" path1tent="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <style> svg{ width: 200px; height: 200px; color: #ffffff; background-color: green; } </style> <body> <svg> <circle cx="100" cy="100" r="80"> <desc> Geeks for geeks </desc> </circle> </svg> </body> </html> |
Output: Please note that the text is not shown in the output.
Example 2: When text inside the desc is given in a rectangle element.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" path1tent="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <style> svg{ width: 200px; height: 200px; color: black; background-color: green; } </style> <body> <svg> <rect aria-describedby="info" width="180" height="100" x="10" y="50" fill="white" stroke="black"> <desc id="info"> Geeks for geeks </desc> </rect> </svg> </body> </html> |
Output:
Please Login to comment...