CSSでテキスト選択を不可・禁止にする方法
CSSでテキスト選択を不可・禁止にしたい。
マウスでテキストをドラッグ選択出来ないようにしたい。
本記事ではこのような悩みを解決。
実装例を元に解説します。
実装サンプル
See the Pen
CSSでテキスト選択を不可 by Kohei (@kouk05)
on CodePen.0
実装サンプルです。
マウスでテキスト部分にカーソルを合わせてドラッグしても、テキスト選択出来ません。
実装手順は以下の通りです。
CSSでテキスト選択を不可・禁止にする
p {
user-select: none;
}
CSSでテキスト選択を不可・禁止にするコード例です。
user-selectプロパティを選択不可にしたい要素に付与します。
user-selectの値にnoneを指定。
テキスト選択不可になります。
まとめ
CSSでテキスト選択を不可・禁止にする方法について紹介しました。
以上で解説を終わります。
目次