Open In App

HTML DOM Table cellSpacing Property

Improve
Improve
Like Article
Like
Save
Share
Report

The HTML DOM Table cellSpacing Property is used to set or return the value of the cellSpacing attribute of an <table> element.  The cellSpacing attribute is used to define the spaces between the cells. 

Note: This property is no longer supported in HTML5.

Syntax

  • It returns the cellSpacing Property. 
     
TableObject.cellSpacing
  • It is used to sets the cellSpacing Property. 
     
TableObject.cellSpacing = "pixels"

Property Values: It contains the numeric value which represents the number of spaces between the two cells in terms of pixels. 

  
Return Value : It returns a numeric value that represents the space between the cells in terms of pixel. 

Example 1: Below code returns the Table cellSpacing Property. 

 

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>
        Table cellSpacing Property in HTML
    </title>
  
    <style>
        table,
        td {
            border: 1px solid green;
        }
  
        h1 {
            color: green;
        }
  
        h2 {
            font-family: Impact;
        }
  
        body {
            text-align: center;
        }
    </style>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
    <h2>Table cellSpacing Property</h2>
  
    <table id="GFG" align="center" cellspacing="20">
        <thead>
            <tr>
                <th>Subject</th>
                <th>Courses</th>
            </tr>
        </thead>
        <tr>
            <td>Java</td>
            <td>Fork Java</td>
        </tr>
        <tr>
            <td>Python</td>
            <td>Fork Python</td>
        </tr>
        <tr>
            <td>Placements</td>
            <td>Sudo Placement</td>
        </tr>
    </table>
    <br />
  
    <button ondblclick="Table_Caption()">
        Return CellPadding
    </button>
      
    <p id="sudo"></p>
  
  
    <script>
        function Table_Caption() {
            var w = document.getElementById(
                    "GFG").cellSpacing;
  
            document.getElementById(
                "sudo").innerHTML = w + "PX";
        }
    </script>
</body>
  
</html>


Output:

Example 2: Below HTML code illustrates how to set the cellSpacing Property. 

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>
        Table cellSpacing Property in HTML
    </title>
  
    <style>
        table,
        td {
            border: 1px solid green;
        }
  
        h1 {
            color: green;
        }
  
        h2 {
            font-family: Impact;
        }
  
        body {
            text-align: center;
        }
    </style>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
    <h2>Table cellSpacing Property</h2>
  
    <table id="GFG" align="center" cellspacing="20">
        <thead>
            <tr>
                <th>Subject</th>
                <th>Courses</th>
            </tr>
        </thead>
        <tr>
            <td>Java</td>
            <td>Fork Java</td>
        </tr>
        <tr>
            <td>Python</td>
            <td>Fork Python</td>
        </tr>
        <tr>
            <td>Placements</td>
            <td>Sudo Placement</td>
        </tr>
    </table>
    <br />
  
    <button ondblclick="Table_Caption()">
        Return CellPadding
    </button>
      
    <p id="sudo"></p>
  
  
    <script>
        function Table_Caption() {
              
            // Pixel set
            var w = (document.getElementById(
                "GFG").cellSpacing = "5");
  
            document.getElementById(
                "sudo").innerHTML = w + "PX";
        }
    </script>
</body>
  
</html>


Output:

Supported Browsers:

  • Google Chrome
  • Firefox
  • Apple Safari
  • Internet Explorer
  • Opera


Last Updated : 04 Jan, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads