Tīpoka ki te ihirangi matua Tīpoka ki te whakaterenga tuhinga
Check
in English

Whakawhitiwhiti

Ko nga karaehe taputapu e whakarereke ana i te taunekeneke a nga kaiwhakamahi me nga ihirangi o te paetukutuku.

Kōwhiringa kuputuhi

Hurihia te huarahi e kowhiria ai te ihirangi ina taunekeneke te kaiwhakamahi ki a ia.

Ka tohua katoatia tenei kowae ina pawhiria e te kaiwhakamahi.

Kei tenei kōwae te whanonga whiriwhiri taunoa.

Ka kore e taea te whiriwhiri i tenei waahanga ina paatohia e te kaiwhakamahi.

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>

Nga huihuinga tohu

.pe-noneKa whakaratohia e Bootstrap nga .pe-autokaraehe hei aukati, hei taapiri ranei i nga taunekeneke huānga.

Kaore e taea te paato i tenei hononga .

Ka taea te paato i tenei hononga (he whanonga taunoa tenei).

Kaore e taea te paato i tenei honongapointer-events na te mea he taonga tuku iho mai i tona matua. Heoi ano, he karaehe to tenei honongape-auto , ka taea te panui.

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>

Ko te .pe-nonekaraehe (me te pointer-eventstaonga CSS kua whakaritea e ia) ka aukati noa i nga taunekeneke me te atatohu (kiore, stylus, pa). Ko nga hononga me nga mana whakahaere .pe-none, ma te taunoa, ka aro tonu me te mahi mo nga kaiwhakamahi papapātuhi. Hei whakarite kia kore rawa ratou mo nga kaiwhakamahi papapātuhi, ka hiahia pea koe ki te taapiri i etahi atu huanga penei i te tabindex="-1"(hei aukati i a raatau ki te aro ki te papapātuhi) me te aria-disabled="true"(hei whakaatu i te meka kua tino haua ratou ki nga hangarau awhina), me te whakamahi JavaScript ki te tino aukati i a raatau ki te mahi.

Mena ka taea, ko te otinga ngawari ake ko:

  • Mo nga mana puka, taapirihia te disabledhuanga HTML.
  • Mo nga hononga, tangohia te hrefhuanga, ka waiho hei punga kore-whakawhitiwhiti, hono hono puri ranei.

Sass

API taputapu

Ko nga taputapu taunekeneke e whakaatuhia ana i roto i o maatau taputapu API i roto i scss/_utilities.scss. Akohia me pehea te whakamahi i nga taputapu API.

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