DevToolBox

🔒 CSS user-select ジェネレーター

テキスト選択の動作を制御するCSSを生成します

user-select 値を選択

ライブプレビュー

このテキストを選択してみてください。

現在の設定: user-select: none

マウスでドラッグして選択動作を確認できます。

生成されたCSS

.element {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

ℹ️ 使用上の注意

  • none: コピー防止やUI要素の選択防止に使用
  • text: 通常のテキスト選択動作(デフォルト)
  • all: コードブロックやタグのワンクリック選択に便利
  • auto: ブラウザが自動判定(編集可能要素など)
  • contain: 要素の境界を越えて選択できない