Entèaksyon

Klas sèvis piblik ki chanje fason itilizatè yo kominike avèk sa ki nan yon sit entènèt.

Seleksyon tèks

Chanje fason yo chwazi kontni an lè itilizatè a reyaji avèk li.

Paragraf sa a pral antyèman chwazi lè itilizatè a klike sou.

Paragraf sa a gen konpòtman seleksyon default.

Paragraf sa a pa pral chwazi lè itilizatè a klike sou li.

html

<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>

Evènman pointer

Bootstrap bay .pe-noneak .pe-autoklas pou anpeche oswa ajoute entèraksyon eleman.

Lyen sa a pa ka klike.

Ou ka klike sou lyen sa a (sa a se konpòtman default).

Yo pa ka klike sou lyenpointer-events sa a paske se pwopriyete a eritye de paran li. Sepandan, lyen sa a gen yon pe-autoklas epi yo ka klike sou.

html

<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>

Klas .pe-nonela (ak pointer-eventspwopriyete CSS li mete) sèlman anpeche entèraksyon ak yon pointeur (sourit, dyaman, manyen). Lyen ak kontwòl ak .pe-noneyo, pa default, toujou konsantre ak aksyon pou itilizatè klavye yo. Pou asire ke yo konplètman netralize menm pou itilizatè klavye, ou ka bezwen ajoute plis atribi tankou tabindex="-1"(pou anpeche yo resevwa konsantre klavye) ak aria-disabled="true"(pou transmèt lefèt ke yo efektivman enfim nan teknoloji asistans), epi pètèt itilize JavaScript pou konplètman anpeche yo pran aksyon.

Si sa posib, solisyon ki pi senp lan se:

Pou kontwòl fòm, ajoute disabledatribi HTML la.

Pou lyen, retire hrefatribi a, fè li yon jete lank ki pa entèaktif oswa yon lyen plas.

Sass

Itilite API

Entèaksyon sèvis piblik yo deklare nan API sèvis piblik nou an nan scss/_utilities.scss. Aprann kijan pou itilize API sèvis piblik yo.

    "user-select": (
      property: user-select,
      values: all auto none
    ),
    "pointer-events": (
      property: pointer-events,
      class: pe,
      values: none auto,
    ),