Interacciones nisqakuna
Utilidad clasekuna imayna ruwaqkuna huk web kitipi contenidokunawan tinkinku chayta tikranku.
Qillqa akllay
Imayna ruwana akllasqa kaqta tikray mayk'aq llamk'achiq chaywan tinkin.
Kay parrafoqa tukuyninpi akllasqa kanqa, llamk'achiq ñit'iptin.
Kay parrafoqa ñawpaqmanta akllay ruwayniyuqmi.
Kay parrafoqa manam akllanapaqchu kanqa, llamk'achiq ñit'iptin.
<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>
Puntero sucesokuna
Bootstrap qun .pe-none
chaymanta .pe-auto
clasekuna elemento tinkiykuna harkananpaq utaq yapananpaq.
Kay t'inkitaqa manam ñit'iyta atikunmanchu.
Kay t'inkitaqa ñit'iy atikunmi (kayqa ñawpaqmanta ruwasqa ruwaymi).
Kay t'inkiqa manam ñit'iyta atikunmanchu, chay pointer-events
propiedad tayta-mamanmanta herenciayuq kasqanrayku. Ichaqa kay t’inkiqa huk pe-auto
claseyuqmi, chaymi ñit’iy atikun.
<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
Clase (hinallataq
CSS
pointer-events
propiedad churasqa) huk rikuchiqwan (sillu, qillqana, llamiy) tinkiykunallata hark'an. T'inkikuna chaymanta kamachiykuna kaqwan
.pe-none
kanku, ñawpaqmanta, hinallataq teclado ruwaqkunapaq enfocables chaymanta ruwanapaq. Aswan allinta neutralizasqa kasqankuta teclado ruwaqkunapaqpas, aswan atributokuna yapanayki kanman kayhina
tabindex="-1"
(mana teclado enfoqueta chaskinankupaq) chaymanta
aria-disabled="true"
(yanapakuq tecnologiakunaman chiqamanta allinta mana llamk'achisqa kasqankuta chayachinapaq), chaymanta JavaScript llamk'achiyta atikunkiman tukuyninpi hark’anku mana ruway atiy kanankupaq. Formulario kamachiykunapaq,
disabled
HTML laya llamk'achiyta qhaway.
Sass
API de Utilidades nisqa
Interacción yanapakuykuna yanapakuyniyku API kaqpi willasqa kachkanku scss/_utilities.scss
. Yachay imayna ruwanakuna API llamk'achiyta.
"user-select": (
property: user-select,
values: all auto none
),
"pointer-events": (
property: pointer-events,
class: pe,
values: none auto,
),