cssblog.ir logo
P

user-select

جلوگیری از انتخاب/کپی متن صفحات وب

مشخصه user-select در CSS می تواند قسمت های قابل انتخاب متن را کنترل کند و جلوی انتخاب متن با موس را بگیرد

در زمان های نه چندان دور که گوگل به خوبی امروز نمی توانست تفاوت مطالب کپی شده و اصلی را تشخیص دهد، مساله کپی مطالب برای برخی بخصوص وبلاگ‌ها مسئله مهمی بود و برای جلوگیری از کلیک راست یا جلوگیری از انتخاب متن، دست به کارهای بسیاری می‌زدند. مشخصه user-select در CSS می‌تواند در تعیین رفتار مرورگر در هنگام انتخاب متن‌ها به ما کمک کند.

اگر مقدارnone برای این مشخصه وارد شود، متن‌ها دیگر مانند همیشه قابل انتخاب نخواهند بود:

در مثال دیگر امکان انتخاب متن مانند حالت عادی وجود ندارد 

مقدار all

مقدار بسیار جالب این مشخصه،all است. با وارد نمودن مقدارall با یک کلیک، تمام متن آن قسمت انتخاب می شود. مانند:

بدلیل استفاده از مقدار all با یک کلیک کل متن انتخاب می‌شود

 مقدار auto

این مقدار نیز بصورت خودکار توسط مرورگر تعیین می شود که می تواند در شرایط مختلف، باعث بروز رفتارهای مختلف شود:

  • اگر عنصر editable باشد به معنی contain خواهد بود.
  • روی شبه عنصر های ::before و ::after مانند none عمل می کند.
  • اگر مقدار user-select روی والد all باشد، auto فرزند نیز به معنی all و اگر والد none باشد، در فرزند نیز به معنی none خواهد بود.
  • اگر حالتی غیر از حالات قبلی رخ دهد، مقدار برابر text خواهد بود.

خوشحال می‌شویم که اگر اطلاعاتی درباره مقدارهایcontain وtext دارید در بخش کامنت ها به اشتراک بگذارید تا به مطلب اضافه شوند

دیدگاه کاربران

تاکنون <% totalComments %> دیدگاه برای این مطلب ثبت شده است.

تاکنون دیدگاهی ثبت نشده است. شما می توانید اولین شخصی باشید که دیدگاه خود را ارسال می کند

<% errorMessage %>

<% comment.name %>

avatar
<% comment.comment_replies.length %> پاسخ برای این دیدگاه ثبت شده است

<% reply.name %>

avatar

ارسال دیدگاه جدید

برای ارسال دیدگاه یا پرسش جدید از طریق فرم زیر اقدام کنید.

ارائه پاسخ به دیدگاه

شما در حال پاسخ دادن به دیدگاه «<% replyComment.name %>» هستید. انصراف از پاسخ

  • <% s %>
  • <% e %>

نکاتی درباره دیدگاه ها

  1. برای حذف کپچا (عبارت امنیتی) وارد اکانت خود شوید
  2. شما می توانید از markdown داخل کامنت خود استفاده کنید (اطلاعات بیشتر)
  3. دیدگاه ها قبل از نمایش نیازمند تائید می باشند