Tlula eka nhlokomhaka-nkulu Tlula eka docs navigation
in English

Ku tirhisana

Titlilasi ta vukorhokeri leti cincaka ndlela leyi vatirhisi va tirhisanaka ha yona ni leswi nga endzeni ka webusayiti.

Ku hlawuriwa ka tsalwa

Cinca ndlela leyi nhundzu yi hlawuriwa ha yona loko mutirhisi a tirhisana na yona.

Ndzima leyi yi ta hlawuriwa hi ku helela loko yi tsindziyeriwa hi mutirhisi.

Ndzima leyi yi na mahanyelo yo hlawula ya xiviri.

Ndzima leyi a yi nge hlawuleki loko yi tsindziyeriwa hi mutirhisi.

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

Swiendlakalo swa nkomiso

Bootstrap yi nyika .pe-nonena .pe-autotitlilasi ku sivela kumbe ku engetela ku tirhisana ka swiaki.

Link leyi a yi nge clicki.

Xihlanganisi lexi xi nga tsindziyeriwa (leswi i mahanyelo ya xiviri).

Link leyi a yi nge tikhomiwi hikuva pointer-eventsnhundzu yi kumiwile ndzhaka eka mutswari wa yona. Kambe link leyi yina pe-autoclass naswona yinga clickiwa.

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

Tlilasi .pe-none(na pointer-eventsnhundzu ya CSS leyi yi yi vekaka) yi sivela ntsena ku tirhisana na nkomiso (mbeva, xitsalo, ku khumba). Swihlanganisi na vulawuri na .pe-none, hi ku tiyimisela, swa ha kongomisiwa na ku teka goza eka vatirhisi va khibhodi. Ku tiyisisa leswaku ti nga tirhisiwi hi ku helela hambi ku ri eka vatirhisi va khibhodi, u nga ha lava ku engetela swihlawulekisi swin’wana swo tanihi tabindex="-1"(ku va sivela ku amukela ku kongomisa ka khibhodi) na aria-disabled="true"(ku hundzisela mhaka ya leswaku va tshikiwile hi ndlela leyinene eka thekinoloji yo pfuneta), naswona swi nga endleka u tirhisa JavaScript ku va sivela hi ku helela leswaku va nga vi na goza.

Loko swi koteka, ntlhantlho wo olova hi lowu:

  • Eka vulawuri bya fomo, engetela disabledxihlawulekisi xa HTML.
  • Eka swihlanganisi, susa hrefxihlawulekisi, u endla leswaku xi va anchor leyi nga tirhisiki kumbe xihlanganisi xa placeholder.

Sass

API ya switirhisiwa

Switirhisiwa swa vuhlanganisi swi tivisiwile eka API ya hina ya switirhisiwa hi scss/_utilities.scss. Dyondza ndlela yo tirhisa API ya switirhisiwa.

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