keyboard_return  چسبون مقالات آموزشی آموزش غیرفعال کردن select در CSS
  1. آموزش غیرفعال کردن select در CSS

جلوگیری از کپی شدن متن در CSS

متن موجود در صفحات وب به سادگی قابل کپی شدن می باشد. گاهی اوقات ممکن است بخواهید از انتخاب شدن متن قسمتی از صفحه و در نتیجه کپی شدن آن متن جلوگیری کنید. به همین منظور باید خاصیت Select را برای آن بخش از صفحه غیر فعال کنید در ادامه نحوه غیر فعال کردن select با استفاده از CSS را آموزش خواهیم داد.

در این آموزش ما با استفاده از ویژگی user-select در css امکان انتخاب شدن متن را غیر فعال خواهیم کرد. به کد زیر توجه کنید:

.disable-selection {
    -webkit-user-select: none;
    /* Chrome, Safari, and Opera */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer */
}

یک کلاس با نام disable-selection تعریف کرده و ویژگی user-select را برای مرورگر های مختلف را در آن برابر با none قرار دادیم.

  • پیشوند webkit برای مرورگرهای کروم، سافاری و اپرا بکار می رود.
  • پیشوند moz برای مرورگر فایرفاکس استفاده می شود.
  • پیشوند ms برای اینترنت اکسپلورر بکار می رود.

دقت داشته باشید برای اینکه ویژگی تعریف شده در تمام مرورگرها به درستی کار کند باید این دستور را برای انواع مرورگر با استفاده از پیشوند های اشاره شده در بالا تعریف نمایید.

نکات:

با توجه به اینکه ویژگی user-select به خوبی توسط مرورگرها پشتیبانی و اجرا می شود اما یک ویژگی استاندارد CSS به حساب نمی آید به همین دلیل ما در مثال فوق از این ویژگی بدون پیشوند استفاده نکردیم.

این دستور ممکن است در مرورگرهای قدیمی که از CSS3 پشتیبانی نمی کنند، کار نکند.

ممکن است این قابلیت توسط کاربر غیر فعال شود و متن را کپی کند.

چسبون- مرجع برنامه نویسی و طراحی وب

 

آموزش غیرفعال کردن select در CSS - 4.2 از 5 بر اساس 150 رای

امتیاز کاربران

آموزش غیرفعال کردن select در CSS
دیدگاه‌ها

دیدگاهی وجود ندارد

2024 © Copyright کليه حقوق مادی و معنوی براي چسبون محفوظ است و هرگونه کپی برداری پیگرد قانونی دارد.