ئاساسلىق مەزمۇنغا ئاتلاڭ Docs يول باشلاش
in English

ئۆز-ئارا تەسىر كۆرسىتىش

ئىشلەتكۈچىلەرنىڭ توربېكەت مەزمۇنى بىلەن بولغان ئالاقىسىنى ئۆزگەرتىدىغان پايدىلىق دەرسلەر.

تېكىست تاللاش

ئىشلەتكۈچى ئۇنىڭ بىلەن ئالاقە قىلغاندا مەزمۇننىڭ تاللاش ئۇسۇلىنى ئۆزگەرتىڭ.

بۇ ئابزاس ئىشلەتكۈچى چەككەندە پۈتۈنلەي تاللىنىدۇ.

بۇ ئابزاسنىڭ سۈكۈتتىكى تاللاش ھەرىكىتى بار.

بۇ ئابزاس ئىشلەتكۈچى چەككەندە تاللانمايدۇ.

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

كۆرسەتكۈچ ھادىسىسى

Bootstrap ئېلېمېنتلارنىڭ ئۆز-ئارا تەسىر قىلىشىنىڭ ئالدىنى .pe-noneئېلىش .pe-autoياكى قوشۇش ئۈچۈن دەرس بېرىدۇ.

بۇ ئۇلانمىنى چېكىشكە بولمايدۇ.

بۇ ئۇلانمىنى چېكىشكە بولىدۇ (بۇ سۈكۈتتىكى ھەرىكەت).

بۇ ئۇلانمىنى چېكىشكە بولمايدۇ ، چۈنكى pointer-eventsمۈلۈك ئاتا-ئانىسىدىن مىراس قالغان. قانداقلا بولمىسۇن ، بۇ ئۇلانمىنىڭ سىنىپى بار pe-auto، ئۇنى چېكىشكە بولىدۇ.

<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>
سىنىپ .pe-none(ۋە pointer-eventsئۇ بەلگىلىگەن CSS خاسلىقى) پەقەت كۆرسەتكۈچ (مائۇس ، قەلەم ، چەكمە) بىلەن ئۆز-ئارا تەسىرنىڭ ئالدىنى ئالىدۇ. ئۇلىنىش ۋە كونتروللار .pe-noneسۈكۈتتىكى ھالەتتە يەنىلا كۇنۇپكا تاختىسى ئىشلەتكۈچىلەر ئۈچۈن فوكۇس نۇقتىسى ۋە ھەرىكەتچان بولىدۇ. tabindex="-1"ئۇلارنىڭ كۇنۇپكا تاختىسى ئىشلەتكۈچىلەر ئۈچۈنمۇ پۈتۈنلەي نېيتراللىشىشىغا كاپالەتلىك قىلىش ئۈچۈن ، (ئۇلارنىڭ كۇنۇپكا تاختىسىنىڭ فوكۇسنى قوبۇل قىلىشىنىڭ ئالدىنى ئېلىش) ۋە aria-disabled="true"(ئۇلارنىڭ ياردەمچى تېخنىكىلارغا ئۈنۈملۈك چەكلەنگەنلىكىنى يەتكۈزۈش ) قاتارلىق تېخىمۇ كۆپ خاسلىقلارنى قوشۇشىڭىز مۇمكىن ، ھەمدە JavaScript نى ئىشلىتىشىڭىز مۇمكىن. ئۇلارنىڭ ھەرىكەتچان بولۇشىنى پۈتۈنلەي توسىدۇ. جەدۋەلنى كونترول قىلىش ئۈچۈن ، disabledHTML خاسلىقىنى ئىشلىتىشنى ئويلاڭ.

Sass

Utilities API

ئۆز-ئارا تەسىر كۆرسىتىش ئەسلىھەلىرى بىزنىڭ API دىكى ئېلان قىلىندى scss/_utilities.scss. API نى قانداق ئىشلىتىشنى ئۆگىنىۋېلىڭ.

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