in English
Interaksi
Kelas utilitas sing ngganti cara pangguna sesambungan karo isi situs web.
Pilihan teks
Ngganti cara isi sing dipilih nalika pangguna sesambungan karo.
Paragraf iki bakal dipilih kabeh nalika diklik dening pangguna.
Paragraf iki nduweni prilaku pilih standar.
Paragraf iki ora bisa dipilih nalika diklik pangguna.
<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>
Acara pointer
Bootstrap nyedhiyakake .pe-none
lan .pe-auto
kelas kanggo nyegah utawa nambah interaksi unsur.
Link iki ora bisa diklik.
Link iki bisa diklik (iki minangka prilaku standar).
Link iki ora bisa diklik amarga pointer-events
properti kasebut diwarisake saka wong tuwa. Nanging, pranala iki duwe pe-auto
kelas lan bisa diklik.
<p><a href="#" class="pe-none" tabindex="-1" aria-disabled="true">This link</a> can not be clicked.</p>
<p><a href="#" class="pe-auto">This link</a> can be clicked (this is default behavior).</p>
<p class="pe-none"><a href="#" tabindex="-1" aria-disabled="true">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>
Kelas
.pe-none
(lan
pointer-events
properti CSS sing disetel) mung nyegah interaksi karo pointer (mouse, stylus, tutul). Tautan lan kontrol
.pe-none
, kanthi gawan, isih bisa fokus lan bisa ditindakake kanggo pangguna keyboard. Kanggo mesthekake yen padha rampung neutralized malah kanggo pangguna keyboard, sampeyan bisa uga kudu nambah atribut liyane kayata
tabindex="-1"
(kanggo nyegah saka nampa fokus keyboard) lan
aria-disabled="true"
(kanggo ngirim kasunyatan padha èfèktif dipatèni kanggo teknologi assistive), lan bisa nggunakake JavaScript kanggo rampung nyegah wong-wong mau saka tumindak. Kanggo kontrol formulir, coba gunakake
disabled
atribut HTML.
Sass
Utilities API
Utilitas interaksi diumumake ing API keperluan kita ing scss/_utilities.scss
. Sinau carane nggunakake API keperluan.
"user-select": (
property: user-select,
values: all auto none
),
"pointer-events": (
property: pointer-events,
class: pe,
values: none auto,
),