CSS
CSS3

user-selectで要素のテキスト選択を「させる」

CSSのプロパティ user-select について。

参考: user-select - CSS | MDN
https://developer.mozilla.org/ja/docs/Web/CSS/user-select

ブラウザサポート状況:
http://caniuse.com/#search=user-select

user-selectとは

(ざっくり言うと)HTML上の要素の選択を制御することができるプロパティです。

指定できる値

キーワード 説明
element 指定された要素内で選択を開始するときに、
テキストを選択できます。
テキスト選択はその要素の境界に制限されます。
none 指定された要素内で選択を開始するときに、
テキストを選択できません。
指定された要素の外で開始されるテキスト選択では、
引き続き要素を入力できます。
text 指定された要素内で選択を開始するときに、
テキストを選択できます。
テキスト選択はその要素の境界に制限されず、
境界を越えて拡張できます。
auto これは初期値です。要素に input 要素など
編集可能テキストが含まれる場合、
contenteditable が "true" に設定された要素の場合、
テキストは選択可能です。 それ以外の場合、
選択は親ノードの -ms-user-select プロパティの
値によって決定されます。

引用:
CSS を使って Web ページにおけるテキスト選択を防ぐ (または有効にする) 方法
https://msdn.microsoft.com/ja-jp/library/jj152140(v=vs.85).aspx

<応用発想> 要素のテキスト選択を「させる」

「テキスト選択をさせないため」のプロパティとして紹介されがちですが、逆に「テキスト選択をさせるため」として利用することもできます。

タブ切り替えのトリガーなど、JavaScriptで動きを制御している要素では「テキスト選択ができない」といった状況に陥っているものがあります。
そういった場合、該当要素に user-select: text; を設定することで、テキストが選択できるようになりました。