Skip to main content Skip to docs navigation Bootstrap 4 (安定版) はこちらです

Interactions (インタラクション)

ユーザーのインタラクションするかを変更するユーティリティクラスです。

Text selection

ユーザのテキスト選択を制御するクラスです。

This paragraph will be entirely selected when clicked by the user.

This paragraph has default select behavior.

This paragraph will not be selectable when clicked by the user.

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

Pointer events

Bootstrapには、インタラクションを防止したり、追加したりするためのカーソル用クラス pe-nonepe-auto を用意しています。

This link can not be clicked.

This link can be clicked (this is default behaviour).

This link can not be clicked because the pointer-events property is inherited from its parent. However, this link has a pe-auto class and can be clicked.

<p><a href="#" class="pe-none">This link</a> can not be clicked.</p>
<p><a href="#" class="pe-auto">This link</a> can be clicked (this is default behaviour).</p>
<p class="pe-none"><a href="#">This link</a> can not be clicked because the <code>pointer-events</code> property is inherited from its parent. However, <a href="#" class="pe-auto">this link</a> has a <code>pe-auto</code> class and can be clicked.</p>