Bootstrap 5 Interactions Text Selection Last Updated : 29 Nov, 2022 Comments Improve Suggest changes Like Article Like Report Bootstrap 5 Interactions Text selection helps us to change the way when a user tries to select the content displayed. Bootstrap 5 Interactions Text selection Classes: user-select-all: When this class is active the entire text will get selected.user-select-auto: When this class is active user can select any amount of text.user-select-none: When this class is active user cannot select any text. Syntax: The * can be substituted with values like all, auto, and none. <p class="user-select-*"> ... </p> Example 1: In this example, we will learn about classes like user-select-all and user-select-auto. HTML <!DOCTYPE html> <html> <head> <link href= "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity= "sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> </head> <body> <div > <h1 class="text-success"> GeeksforGeeks </h1> <h2>Bootstrap5 Interactions Text selection</h2> <p class="user-select-all"> GeeksforGeeks is a computer science portal </p> <p class="user-select-auto"> It provides learnings of various kind of courses like Java, C++, Python, Javascript etc. </p> </div> </body> </html> Output: Bootstrap 5 Interactions Text Selection Example 2: In this example, we will learn about classes like user-select-none. HTML <!DOCTYPE html> <html> <head> <link href= "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity= "sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> </head> <body class="m-5"> <div > <h1 class="text-success"> GeeksforGeeks </h1> <h2>Bootstrap 5 Interactions Text selection</h2> <p class="user-select-none"> GeeksforGeeks is a computer science portal </p> </div> </body> </html> Output: Bootstrap 5 Interactions Text Selection References: https://getbootstrap.com/docs/5.0/utilities/interactions/#text-selection Comment More infoAdvertise with us Next Article Bootstrap 5 Interactions Text Selection A abhiisaxena09 Follow Improve Article Tags : Technical Scripter Web Technologies Bootstrap Technical Scripter 2022 Similar Reads Bootstrap 5 Interactions Pointer Events In bootstrap 5, Interactions is a utility class that controls how elements of a website are interacted with (how the user interacts with them). Pointer events in Interactions come with pe-none and pe-auto classes, to prevent or add element interactions. Let's see each of them in brief. Interactions 2 min read Bootstrap 5 Introduction Bootstrap is a free and open-source collection of CSS and JavaScript/jQuery code used for creating dynamic websites layout and web applications. Bootstrap is one of the most popular front-end frameworks which has really a nice set of predefined CSS codes. Bootstrap uses different types of classes to 4 min read Bootstrap 5 Text Line height Text Line height classes are used to set the gap between the two lines. there are several classes to set the line height. The default line height of the class is lh-base. Bootstrap 5 Text Line height Classes: ClassDescriptionlh-1Set line height to 1lh-smSet line height to smalllh-baseSet line height 2 min read Bootstrap 5 Text Reset color Text Reset color is used to reset the text color or linked text's color. We all know by linking any text we got a blue-colored text. Sometimes we want to remove that color and make it looks like normal text. Text Reset Color Class: text-reset: This class is used to reset the text color. Syntax: < 2 min read Bootstrap 5 Select Default Bootstrap 5 Select Default stylizes dropdown menus, enhancing user experience. However, limitations exist in modifying option styles due to browser constraints, despite offering various customization options for select elements. Bootstrap 5 Select Default Class: form-select: This class is used to tr 2 min read Like