Mu'amala

Azuzuwan masu amfani waɗanda ke canza yadda masu amfani ke hulɗa da abubuwan da ke cikin gidan yanar gizo.

Zaɓin rubutu

Canja hanyar da aka zaɓi abun ciki lokacin da mai amfani ke hulɗa da shi.

Za a zaɓi wannan sakin layi gaba ɗaya idan mai amfani ya danna shi.

Wannan sakin layi yana da halin zaɓi na tsoho.

Ba za a iya zaɓar wannan sakin layi ba lokacin da mai amfani ya danna shi.

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>

Abubuwan nuni

Bootstrap yana samarwa .pe-noneda .pe-autoazuzuwan don hana ko ƙara hulɗar abubuwa.

Ba za a iya danna wannan hanyar haɗin yanar gizon ba.

Ana iya danna wannan hanyar haɗin yanar gizon (wannan dabi'a ce ta asali).

Ba za a iya danna wannan hanyar haɗin yanar gizonpointer-events ba saboda dukiyar an gaji daga iyayenta. Koyaya, wannan hanyar haɗin yanar gizon tana da pe-autoaji kuma ana iya dannawa.

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>

Ajin .pe-none(da kuma kayan pointer-eventsCSS da ya saita) kawai yana hana mu'amala tare da mai nuni ( linzamin kwamfuta, stylus, taɓawa). Hanyoyin haɗi da sarrafawa tare da .pe-none, ta tsohuwa, har yanzu ana iya mai da hankali kuma ana iya aiwatar da su ga masu amfani da madannai. Don tabbatar da cewa an kawar da su gaba ɗaya har ma ga masu amfani da madannai, ƙila za ku buƙaci ƙara ƙarin halaye kamar tabindex="-1"(don hana su karɓar mayar da hankali kan maballin keyboard) da aria-disabled="true"(don isar da gaskiyar cewa an kashe su da kyau ga fasahar taimako), kuma maiyuwa amfani da JavaScript zuwa gaba daya hana su zama masu aiki.

Idan zai yiwu, mafita mafi sauƙi ita ce:

Don sarrafa tsari, ƙara disabledsifa ta HTML.

Don hanyoyin haɗin yanar gizo, cire hrefsifa, mai da shi anka mara ma'amala ko mahaɗin mai riƙewa.

Sass

API ɗin Utilities

Ana ayyana abubuwan haɗin kai a cikin API ɗin mu a cikin scss/_utilities.scss. Koyi yadda ake amfani da API ɗin abubuwan amfani.

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