Skip to content
Related Articles
Get the best out of our app
GeeksforGeeks App
Open App
geeksforgeeks
Browser
Continue

Related Articles

Primer CSS Boolean Attributes

Improve Article
Save Article
Like Article
Improve Article
Save Article
Like Article

Primer CSS is a free open-source CSS framework that is built upon systems that create the foundation of the basic style elements such as spacing, typography, and color. This systematic method makes sure our patterns are steady and interoperable with every other. Its approach to CSS is influenced by object-oriented CSS principles, functional CSS, and BEM architecture. It is highly reusable and flexible. It is created with GitHub’s design system.

Primer CSS Boolean Attributes are those attributes in which we do not need to set the value. If the boolean attribute is present then the value will be true and if it is absent then the value will be false.

Primer CSS Boolean Attributes Attributes:

  • checked: This attribute is used to select the input.
  • disabled: This attribute is used to disable the input.
  • selected: This attribute is used to select the option from the given options.

Syntax:

<input type="checkbox" value="..." checked >

Example 1: This example demonstrates the implementation of Primer CSS Boolean attributes using radio input.

HTML




<!DOCTYPE html>
<html lang="en">
  
<head>
    <title> Primer CSS Boolean Attributes Attributes </title>
    <link rel="stylesheet" href=
"https://unpkg.com/@primer/css@^19.0.0/dist/primer.css" />
</head>
  
<body>
    <div class="text-center">
        <h1 style="color: green">
            GeeksforGeeks
        </h1>
        <h2>
            Primer CSS Boolean Attributes Attributes
        </h2> <br>
          
        <label>
            <input type=checkbox disabled 
                   name="GeeksforGeeks"
            Disabled checkbox
        </label>
    </div>
</body>
  
</html>

Output:

 

Example 2: This example demonstrates the implementation of Primer CSS Boolean Attributes.

HTML




<!DOCTYPE html>
<html lang="en">
  
<head>
    <title> Primer CSS Boolean Attributes Attributes </title>
    <link rel="stylesheet" href=
"https://unpkg.com/@primer/css@^19.0.0/dist/primer.css" />
</head>
  
<body>
    <div class="text-center">
        <h1 style="color: green">
            GeeksforGeeks
        </h1>
        <h2>
            Primer CSS Boolean Attributes Attributes
        </h2> <br>
          
        <select>
            <option value="DS">
                Data Structure
            </option>
            <option value="Java" selected>
                Java
            </option>
            <option value="Python">
                Python
            </option>
        </select>
    </div>
</body>
  
</html>

Output:

 

Reference: https://primer.style/css/principles/html#boolean-attributes


My Personal Notes arrow_drop_up
Last Updated : 08 Jun, 2022
Like Article
Save Article
Similar Reads
Related Tutorials