-->
Showing posts with label svg to draw text. Show all posts
Showing posts with label svg to draw text. Show all posts

Wednesday, July 22, 2020

HTML with SVG to draw text

<html>

<head>

    <head>
        <title>
            html with SVG tag. It stands for scalable vector graphics. It is used for vector based graphics in XML. We use this tag for graphics on web/page.
        </title>
    </head>

    <body>
        <svg viewbox="0 0 200 200"><!--</svg><svg width="100" height="100">-->
            <!--we always use svg for image size. If we donot, it takes 0,0 by default-->

            <text x="20" y="50"  dx="30" fill="red">Hello SVG</text>
        <!--since we are going to put text, we use attributes-->
        <!-- 
           ->X is x co-ordinate
           ->Y is y co-ordinate
           ->dx moves the text to particular x value
           -> stroke is boundary color,stroke-width means width of path outline 
            and fill means color of text.
            
        
        -->
        
        
        
        </svg>




    </body>


</html>

HTML with SVG to draw text.

<html>

<head>

    <head>
        <title>
            html with SVG tag. It stands for scalable vector graphics. It is used for vector based graphics in XML. We use this tag for graphics on web/page.
        </title>
    </head>

    <body>
        <svg viewbox="0 0 200 200"><!--</svg><svg width="100" height="100">-->
            <!--we always use svg for image size. If we donot, it takes 0,0 by default-->

            <text x="20" y="50"  fill="red">Hello SVG</text>
        <!--since we are going to put text, we use attributes-->
        <!-- 
           ->X is x co-ordinate
           ->Y is y co-ordinate
           -> stroke is boundary color,stroke-width means width of path outline 
            and fill means color of text.
            
        
        -->
        
        
        
        </svg>




    </body>


</html>