Bulma es un marco CSS de código abierto que se envía con elementos y componentes prediseñados que facilitan el desarrollo de interfaces web receptivas y hermosas. En este artículo, veremos cómo hacer que el texto no se pueda seleccionar usando el modificador is-unselectable en Bulma.
Clases no seleccionables de Bulma:
- is-unselectable: el uso de esta clase en un elemento hace que el texto dentro de él no se pueda seleccionar.
Sintaxis:
<p class="is-unselectable">...</p>
Ejemplo: El siguiente ejemplo muestra el uso del modificador is-unselectable para evitar que se seleccione parte del texto.
HTML
<!DOCTYPE html> <html> <head> <title>Bulma Unselectable</title> <link rel='stylesheet' href= 'https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css'> </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>
Producción:
Referencia: https://bulma.io/documentation/helpers/other-helpers/