Sourceපේජිනේෂන්
පිටු කිහිපයක් පුරා පවතින අදාළ අන්තර්ගත මාලාවක් දැක්වීමට පිටු සලකුණු පෙන්වීම සඳහා ලියකියවිලි සහ උදාහරණ.
අපි අපගේ පිටු සැකසීම සඳහා සම්බන්ධිත සබැඳි විශාල ප්රමාණයක් භාවිතා කරන අතර, සබැඳි මඟ හැරීමට අපහසු වන අතර පහසුවෙන් පරිමාණය කළ හැකි-සියල්ල විශාල ප්රදේශ සපයන අතරම. පිටු සැකසීම ලැයිස්තුගත HTML මූලද්රව්ය සමඟ ගොඩනගා ඇති බැවින් තිර කියවන්නන්ට පවතින සබැඳි ගණන ප්රකාශ කළ හැක. <nav>
තිර කියවන්නන් සහ අනෙකුත් සහායක තාක්ෂණයන් වෙත එය සංචාලන අංශයක් ලෙස හඳුනා ගැනීමට දවටන අංගයක් භාවිතා කරන්න .
මීට අමතරව, පිටුවල එවැනි සංචාලන අංශ එකකට වඩා ඇති බැවින්, එහි අරමුණ පිළිබිඹු කිරීම aria-label
සඳහා විස්තරයක් සැපයීම සුදුසුය. <nav>
උදාහරණයක් ලෙස, සෙවුම් ප්රතිඵල සමූහයක් අතර සැරිසැරීමට pagination සංරචකය භාවිතා කරන්නේ නම්, සුදුසු ලේබලයක් විය හැක aria-label="Search results pages"
.
සමහර පේජිනේෂන් සබැඳි සඳහා පෙළ වෙනුවට අයිකනයක් හෝ සංකේතයක් භාවිතා කිරීමට බලාපොරොත්තු වන්නේද? aria
ගුණාංග සහ .sr-only
උපයෝගිතා සමඟ නිසි තිර කියවනය සහාය ලබා දීමට වග බලා ගන්න .
ආබාධිත සහ ක්රියාකාරී තත්ත්වයන්
පේජිනේෂන් සබැඳි විවිධ තත්වයන් සඳහා අභිරුචිකරණය කළ හැකිය. .disabled
ක්ලික් කළ නොහැකි ලෙස පෙනෙන සබැඳි සඳහා සහ .active
වත්මන් පිටුව දැක්වීමට භාවිතා කරන්න .
s හි සබැඳි ක්රියාකාරීත්වය අක්රිය කිරීමට පන්තිය .disabled
භාවිතා pointer-events: none
කරන අතර , එම CSS ගුණය තවමත් ප්රමිතිගත කර නොමැති අතර යතුරුපුවරු සංචාලනය සඳහා ගණන් නොගනී . <a>
එනිසා, ඔබ සැමවිටම tabindex="-1"
අබල කළ සබැඳි එක් කළ යුතු අතර ඒවායේ ක්රියාකාරීත්වය සම්පූර්ණයෙන්ම අක්රිය කිරීමට අභිරුචි ජාවාස්ක්රිප්ට් භාවිත කළ යුතුය.
ක්ලික් කිරීමේ ක්රියාකාරිත්වය ඉවත් කිරීමට සහ අපේක්ෂිත මෝස්තර රඳවා තබා ගනිමින් යතුරුපුවරු නාභිගත වීම වැළැක්වීමට, ඔබට විකල්ප වශයෙන් සක්රිය හෝ අක්රිය නැංගුරම් මාරු කළ හැකිය <span>
, නැතහොත් පෙර/ඊළඟ ඊතල සම්බන්ධයෙන් නැංගුරම ඉවත් කළ හැකිය.
විශාල හෝ කුඩා පිටුවක් කිරීමට කැමතිද? එකතු කරන්න .pagination-lg
හෝ .pagination-sm
අමතර ප්රමාණ සඳහා.
flexbox උපයෝගිතා සමඟින් pagination සංරචක පෙළගැස්වීම වෙනස් කරන්න .