Open In App

Bulma Unselectable

Last Updated : 14 Feb, 2022
Improve
Improve
Like Article
Like
Save
Share
Report

Bulma is an open-source CSS framework that ships with pre-styled elements and components which makes it easier to develop responsive and beautiful web interfaces. In this article, we will be seeing how to make text unselectable using the is-unselectable modifier in Bulma.

Bulma Unselectable Classes:

  • is-unselectable: Using this class on an element makes the text unselectable inside it.

Syntax:

<p class="is-unselectable">...</p>

Example: The example below shows the use of the is-unselectable modifier to prevent some text from being selected.

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>Bulma Unselectable</title>
    <link rel='stylesheet' href=
</head>
  
<body class="has-text-centered">
    <h1 class="is-size-2 has-text-success">
        GeeksforGeeks
    </h1>
      
    <b class="is-size-4">Bulma Unselectable</b>
      
    <div class="container mt-5 is-fluid">
        <p>This text will get selected.</p>
        <p class="is-unselectable">
            This text will not get selected as
            it has <code>is-unselectable</code
            modifier on it.
        </p>
  
        <p>This text will also get selected.</p>
    </div>
</body>
  
</html>


Output:

Reference: https://bulma.io/documentation/helpers/other-helpers/



Previous Article
Next Article

Similar Reads

Bulma Align items
Bulma is a modern, free and open-source CSS framework built on flexbox. It comes with pre-styled components and elements that let you create beautiful and responsive websites fast. It is component-rich, compatible, and well documented. It is highly responsive in nature. It uses classes to implement its design. Bulma align-items classes are used to
3 min read
Bulma Flexbox
Bulma is a free and open-source CSS framework based on Flexbox. It is component-rich, compatible, and well documented. It is highly responsive in nature. It uses classes to implement its design. A flexbox is a layout used to define various columns and rows that makes the grid-like structure. It is used to design a flexible responsive layout structu
3 min read
Bulma | Tabs
Bulma is a free and open-source CSS framework based on Flexbox. It is component rich, compatible, and well documented. It is highly responsive in nature. It uses classes to implement its design. Tabs in Bulma are simple responsive horizontal navigation tabs with different styles. They require the following structure: A container for the tabs.The HT
6 min read
Bulma Notification Colors
Bulma is a free, open-source CSS framework based on Flexbox. It is component-rich, compatible, and well documented. It is highly responsive in nature. It uses classes to implement its design. The notification is a simple colored block that draws the attention of the user to something. It can be used as a pinned notification in the corner of the vie
4 min read
Bulma Responsiveness
Bulma uses Sass mixins to create the CSS output and they are mainly used within the context of the Bulma framework. In this article, we will know about Bulma Responsive. Bulma is a component-rich, mobile-first CSS framework based on flexbox. Since Bulma is a mobile-first framework, it supports the following responsiveness features: Vertical by defa
4 min read
Bulma Panel Variables
Bulma is an Open source CSS framework developed by Jeremy Thomas. This framework is based on the CSS Flexbox property. It is highly responsive, minimizing the use of media queries for responsive behavior. Another advantage with Bulma is that you simply need to have an understanding of HTML and CSS to implement this framework (Although knowing JavaS
5 min read
Bulma Options
Bulma is a free, open-source CSS framework based on Flexbox. It is component rich, compatible, and well documented. It is highly responsive in nature. It uses classes to carry out its design.The ‘select’ component of a form is not that attractive in look. Using Bulma we can design select elements of the form in a far better way just by adding some
2 min read
Bulma Mobile Level
Bulma is an open-source CSS framework based on flexbox that can be used to make your web development faster as it comes with pre-built components and elements. In this article, we will be seeing Bulma Mobile Level. A level in Bulma is a multipurpose horizontal level that can contain any element inside it. All the elements inside the level are verti
2 min read
Bulma | Tags
Bulma is a free, open-source CSS framework based on Flexbox. It is component rich, compatible, and well documented. It is highly responsive in nature. It uses classes to implement its design. The Bulma tag is a small element that is very useful to attach information to a block or other component. Example 1: Simple Tag elements &lt;html&gt; &lt;head
4 min read
Bulma Notification Light colors
Bulma is a free, open-source CSS framework based on Flexbox. It is component-rich, compatible, and well documented. It is highly responsive in nature. It uses classes to implement its design. The notification is a simple colored block that draws the attention of the user to something. It can be used as a pinned notification in the corner of the vie
4 min read
Article Tags :