جهت ورود به تالار گفتمان سایت کلیک کنید


آموزش تغییر استایل selection متن ( متن انتخاب شده در سایت )

همانطور که میدانید به صورت پیشفرض , رنگ جملاتی که در وب سایت select میکنید به صورت زمینه آبی رنگ می باشد .

شما میتوانید به راحتی این خاصیت پیشفرض رو تغییر دهید و دیزاین خود را جایگزین کنید .

برای این کار به شیوه نامه (style.css) وبلاگ , وبسایت , قالب وردپرس و … خود رفته و در این فایل ( معمولا در همان خطهای اول ) این دو شیوه نامه را اضافه کنید .

توجه : برای اینکه تمامی مرورگر ها  از این خاصیت بهره مند شوند , باید هر دو شیوه نامه ی زیر را در فایل css قرار دهید . طبیعتا مقادیر قرار گرفته در هر دو شیوه نامه باید با هم مساوی باشند .

آموزش تغییر استایل selection متن ( متن انتخاب شده در سایت )

::selection {
 background-color:#eee;
 color: #222;
}
::-moz-selection {
 background-color:#eee;
 color: #222;
}

 نکته : خاصیت background برای رنگ زمینه ( آبی پیشفرض ) و خاصیت color برای تغییر رنگ نوشته درون آن میباشد . 

گردآوری : وحید مجیدی

پخش اختصاصی

جهت تبادل گفتگو و حل مشکلات در باره این موضوع , کلیک کنید

12 پاسخ به “آموزش تغییر استایل selection متن ( متن انتخاب شده در سایت )”

  1. قاسم پور گفت:

    ممنون از توضیحات کاملتون

  2. مهرادمنش گفت:

    باسلام
    ممنونم استاد

  3. dashesi_lamer گفت:

    ممنون

  4. dashesi_lamer گفت:

    منو قبلی سایت یادته وقتی صفحه مرورگر بازه فول اسکرین

    وقتی صفحه مرورگر رو کوچیک میکنی یه منوی کشویی میشه

    • وحید مجیدی گفت:

      داداشی اون حالت ریسپانسیو هست و توضیح دادنش برای نوشتن سخته . اما حتما سعی میکنم مقاله ای در مورد ریسپانسیو در سایت قرار بدم

  5. dashesi_lamer گفت:

    با سپاس داداش گلم یه آموزشی هو در باره منو موبایلی بذاری ممنونت میشم

    خیلی گلی

  6. رضا نصرالهی گفت:

    به نام خدا
    با این وجود برخی جاها هنوز همون رنگ پیش فرض می مونند
    برای مشاهده ctlr+a رو بزنید و ببینید

    • وحید مجیدی گفت:

      طبیعتا این اتفاق می افته اما میتونید با دادن خاصیت padding , کار رو درست یا حداقل بهتر کنید

  7. وحید مجیدی گفت:

    خواهش میکنم . وظیفس :x

  8. مهرادمنش گفت:

    با سلام و درود
    ممنونم

  9. جعفری گفت:

    عالی هست دستت درد نکنه اقای مجیدی

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *