You May Also Like

موضوعنا اليوم حول كهرباء السيارات، ومدى تأثير التأكسد على عملها وكيفية تنظيفه فالتأكسد يسبب تآكل أقطاب البطارية مما يؤدي الى ...
Read More
أفضل طريقة لتنظيف أصابع البطارية من التأكسد
هي كلمة مكونة من شقين "Root" وهو مصطلح مأخوذ من نظام Linux أي "الجذر" وهو ما يقابل مصطلح ال Admin ...
Read More
؟ RootKit ما هو
Google Adwords هو نظام إعلاني بنظام الدفع بالنقرة (PPC). على عكس منصات PPC الأخرى مثل Facebook ، يوفر AdWords للمعلنين ...
Read More
نتيجة بحث الصور عن ‪google AdWord‬‏

 

مفتاح التبديل هو عنصر تحكم رسومي يسمح للمستخدم بالاختيار بين حالتين متعارضتين (مثل تشغيل / إيقاف). في الأصل ، تم استخدام مفاتيح التبديل بشكل أساسي في واجهات المستخدم القائمة على الشاشة التي تعمل باللمس ، ولكنها أصبحت فيما بعد شائعة في تطبيقات سطح المكتب والويب.

تبديل التبديل لها وظيفة مماثلة لمربعات الاختيار ، ولكن على عكس مربعات الاختيار ، فإن التفاعل مع مفتاح التبديل عادة ما يكون له تأثير فوري على التطبيق أو النظام.

طريقة عمل switch btn بإستخدام input وأحد فقط و بدون javascript


تحتوي على البنيه الاساسيه

الخاصية الجديدة هي
appearance: none;

و الهدف منها التخلص من التنسيق الأساسي الذي يقوم المتصفح بعمله لل
input checkbox

بعد التخلص من التنسيق الأساسي من الممكن أضافه التنسيق الخاص بنا بكل سهولة.


نلاحظ ان الأب
.switch

يحتوي على الإبن
.switch::before

 


تم إضافة تنسيق للعنصر before

بعد أضافه التنسيق الخاص بنا


يتم تغيير خلفيه الأب
و تغيير خلفية و مكان الإبن

نستخدم
:checked
من أجل تحديد إذا تم النقر على input checkbox

إذا تم النقر يتم تطبيق الخواص


الخاصية appearance
غير مدعومة في كل المتصفحات و يجب أضافه ال prefix

 

Last Article

error: Content is protected !!