Interactions

Utility classes that change how users interact with the contents of a website.

Text selection

Change how the content is selected when the user interacts with it. Note that Internet Explorer and Legacy Edge have no support for the all value for user-select, and as such, .user-select-all is not supported by either browser.

Interactions - 图1

  1. <p class="user-select-all">This paragraph will be entirely selected when clicked by the user.</p>
  2. <p class="user-select-auto">This paragraph has the default select behavior.</p>
  3. <p class="user-select-none">This paragraph will not be selectable when clicked by the user.</p>

Customize the available classes by changing the $user-selects Sass list in _variables.scss.