Open In App

HTML DOM Table frame Property

Last Updated : 04 Jan, 2022
Summarize
Comments
Improve
Suggest changes
Share
Like Article
Like
Report

The HTML DOM Table frame property is used to set or return the value of the frame attribute of an <table> element. The frame attribute is used to specify the visibility of outside borders. 

Note: This property is not supported by HTML5

Syntax

It is used to return the frame property.

tableObject.frame; 
 

It is used to set the frame property.

tableObject.frame="values"; 

Property values: 

  • void: It is used to hide the outside border.
  • above: It is used to display the outside top border.
  • below: It is used to display the outside bottom border.
  • hsides: It is used to display the outside top and bottom border.
  • vsides: It is used to display the outside left and right border.
  • lhs: It is used to display the outside left border.
  • rhs: It is used to display the outside right border.
  • box: It is used to display all sides of the border.
  • border: It is used to display all outside borders.

Example: Below HTML code returns the table frame property. 

HTML
<!DOCTYPE html>
<html>

<head>
    <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>HTML DOM Table frame Property</h2>

    <table id="tableID" align="center" 
        summary="courses@GeeksforGeeks" 
        frame="void">

        <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="dblClick()">
        Return CellPadding
    </button>

    <p id="paraID"></p>

    <script>
        function dblClick() {
            var w = document
            .getElementById("tableID").frame;

            document.getElementById(
                "paraID").innerHTML = w;
        }
    </script>
</body>

</html>

Output:

Supported Browsers:

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

Article Tags :

Similar Reads