HTML DOM Image vspace Property

Last Updated : 03 Mar, 2022

The HTML DOM Image vspace Property is used to set or return the value of the vspace attribute of the image element. The vspace attribute is used to specify the number of whitespaces from bottom and top side of an Image.

Syntax

It returns the image vspace property.

ImageObject.vspace;

It sets the image vspace property.

ImageObject.vspace="pixels";

Property Values: It contains the value i.e. pixels that indicates the number of whitespaces from the bottom and top side of an image.

Return Value; It returns a numeric value that represents the number of vertical spaces around an Image element.

Note: The <image> vspace Attribute is not supported in HTML 5.

Example 1: This example returns the vspace property.

HTML

<!DOCTYPE html>
<html>

<body>
    <center>
        <h1 style="color: green">
            GeeksforGeeks
        </h1>
        
        <h2>HTML DOM Image vspace Property</h2>
        
        


<p><img id="GFG" vspace="20" align="middle" src=
"https://media.geeksforgeeks.org/wp-content/uploads/20190506164011/logo3.png"
                alt="GeeksforGeeks logo">
            It is a computer science portal for Geeks.
        </p>



        <br>

        <button onclick="Geeks()">
            Click me!
        </button>

        <p id="sudo"></p>



    </center>
    
    <script>
        function Geeks() {
            var g = document.getElementById("GFG").vspace;
            document.getElementById("sudo").innerHTML = g + "px";
        }
    </script>
</body>

</html>

Output:

Example2: This example sets the Image vspace property.

HTML

<!DOCTYPE html>
<html>

<body>
    <center>
        <h1 style="color: green">
            GeeksforGeeks
        </h1>
        
        <h2>HTML DOM Image vspace Property</h2>
        
        


<p> <img id="GFG" vspace="20" align="middle"
src="https://media.geeksforgeeks.org/wp-content/uploads/20190506164011/logo3.png"
                alt="GeeksforGeeks logo">
            It is a computer science portal for Geeks.
        </p>



        <br>

        <button onclick="Geeks()">
            Click me!
        </button>

        <p id="sudo"></p>



    </center>
    
    <script>
        function Geeks() {
            var g = document.getElementById("GFG").vspace = "5";
            document.getElementById("sudo").innerHTML = g + "px";
        }
    </script>
</body>

</html>