آموزش خاصیت تگ Selection در CSS

با نام و یاد خدا
در این پست برای شما عزیزان نحوه استفاده از تگ selection رو آموزش میدم.
حتماً برای شما هم پیش اومده که تو یه سایتی هستین و می خواین که مطالب رو کپی کنین و وقتی که متن رو انتخاب میکنید متن مورد نظر توی یه پس زمینه معمولاً آبی قرار میگیره،به شکل زیر:

مرحله اول : باید برای این تگ یک استایل قرار بدیم تا نمایش داده بشه،برای اینکار ابتدا باید یک تگ باز و بسته ی style درست کنیم(اینکار رو داخل تگ headانجام دهید):

<style>
</style>

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

<style>
::selection{background:#8aae1b; color:#fff;}
</style>

- نکته اول : خوب همونطور که میبینید ما برای شروع این تگ از  (::) استفاده کردیم!چون مخصوص این تگه.
- نکته دوم : ما به این تگ فهموندیم که هرجا یه متن select  (انتخاب) شد رنگ پس زمینه رو به رنگ سبز تغییر بده،اونم با کد: background:#8aae1b
- نکته سوم : در ضمن ما با کد color به تگ selection فهموندیم  که وقتی متن به حالت انتخاب در اومد،رنگ متن هرچی باشه به رنگ سفید تغییر پیدا کنه.
- نکته آخر،برای اینکه این کد تو همه ی مرورگرها اجرا بشه ، باید کد کامل هر مرورگر رو بنویسید که من این کارو کردم،برای اینکه این کد اجرا بشه باید کل کد زیر را بین تگ head قرار بدین ، من برای اینکه متوجه بشین هر کد تو کدوم مرورگر اجرا میشه ، جلو هر کد نام مرورگر پشتیبانی کننده رو نوشتم:

<style>
::selection{color:#fff; background:#8aae1b; /* Safari */}
::-moz-selection {color:#fff; background:#8aae1b; /* Firefox */}
::-webkit-selection {color:#fff; background:#8aae1b; /* Chrome */}
::-ms-selection {color:#fff; background:#8aae1b; /* IE8 */}
::-khtml-selection {color:#fff; background:#8aae1b; /* Browser */}
::-o-selection {color:#fff; background:#8aae1b; /* Opera */}
</style>

بعد از قرار دادن کد باید متن شما به شکل زیر شود: