Open In App

HTML DOM ul compact Property

Improve
Improve
Like Article
Like
Save
Share
Report

The HTML DOM ul compact property is used to set or return the value of a compact attribute of the <ul> tag. The compact attribute is used to define the list should be smaller than normal by reducing the space between the list items and the indentation of the list. It is a Boolean attribute.

Note: This property is not supported in HTML5.

Syntax:  

It returns a ul compact Property. 

ulObject.compact

It is used to set the ul compact property. 

ulObject.compact = "True/false";

Property Values:  

  • true: It defines that the compact attribute is set.
  • false: It has a default value. It defines that the compact attribute is not set.

Return Values: It returns a Boolean value that represents whether the compact attribute is set to true or false.

Example 1: In this example, we will see the use of DOM ul compact Property

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
          DOM ul compact Property
      </title>
</head>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h2>DOM ul compact Property </h2>
    <ul id="Geeks" type="circle" compact>
        <!-- Assigning id to 'li tag' -->
        <li id="GFG">Geeks</li>
        <li>Sudo</li>
        <li>Gfg</li>
        <li>Gate</li>
        <li>Placement</li>
    </ul>
    <button onclick="myGeeks()">
          Submit
      </button>
    <p id="sudo"></p>
 
    <script>
        function myGeeks() {
            // return ul compact Property
            let g = document.getElementById(
                "Geeks").compact;
            document.getElementById(
                "sudo").innerHTML = g;
        }
    </script>
   
</body>
 
</html>


Output: 

 

Example 2: In this example, we will see the use of DOM ul compact Property.

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
          DOM ul compact Property
      </title>
</head>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h2>DOM ul compact Property </h2>
    <ul id="Geeks" type="circle" compact>
       
        <!-- Assigning id to 'li tag' -->
        <li id="GFG">Geeks</li>
        <li>Sudo</li>
        <li>Gfg</li>
        <li>Gate</li>
        <li>Placement</li>
    </ul>
    <button onclick="myGeeks()">
          Submit
      </button>
    <p id="sudo"></p>
 
    <script>
        function myGeeks() {
            // set ul compact Property
            let g = document.getElementById(
                "Geeks").compact = "false";
            document.getElementById(
                "sudo").innerHTML = g;
        }
    </script>
   
</body>
 
</html>


Output: 

 



Last Updated : 21 Jun, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads