Муносибатҳо

Синфҳои коммуналӣ, ки тарзи муоширати корбарон бо мундариҷаи вебсайтро тағир медиҳанд.

Интихоби матн

Тарзи интихоби мундариҷаро ҳангоми муоширати корбар бо он тағир диҳед.

Ин параграф ҳангоми клик аз ҷониби корбар пурра интихоб карда мешавад.

Ин параграф дорои рафтори интихоби пешфарз мебошад.

Ҳангоми клик кардани корбар ин параграф интихоб намешавад.

<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-eventsCSS, ки он муқаррар мекунад) танҳо аз муомила бо нишоннамо (муш, стилус, ламс) пешгирӣ мекунад. Истинодҳо ва назоратҳо бо .pe-noneнобаёнӣ то ҳол барои корбарони клавиатура мутамарказ ва амалкунанда мебошанд. Барои боварӣ ҳосил кардан, ки онҳо ҳатто барои корбарони клавиатура комилан безарар карда мешаванд, ба шумо лозим меояд, ки атрибутҳои иловагӣ илова кунед, ба монанди tabindex="-1"(барои пешгирӣ кардани фокуси клавиатура) ва aria-disabled="true"(барои расонидани он, ки онҳо ба технологияҳои ёрирасон ба таври муассир ғайрифаъол шудаанд) ва эҳтимолан JavaScript-ро истифода баред ба амал баровардани онхо комилан монеъ мешавад.

Агар имконпазир бошад, ҳалли соддатар ин аст:

Барои идоракунии шакл disabledаттрибути HTML-ро илова кунед.

Барои истинодҳо, атрибутро хориҷ кунед hrefва онро лангари ғайри интерактивӣ ё истиноди ҷойнишин созед.

Сасс

API Utilities

Утилитҳои мутақобила дар API утилитаҳои мо дар scss/_utilities.scss. Омӯзед, ки чӣ тавр истифода бурдани API-и коммуналӣ.

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