لقد حددت نمط الارتباط التشعبي باستخدام CSS ، لكن التحويم (تحوم الماوس) لا يعمل عند التصفح. لماذا هذا يحدث؟ هل هي مشكلة المتصفح؟
إجابة:على الرغم من أنك تعتقد أن السبب قد يكون مشكلة في المتصفح ، فمن الأرجح أن تعريف الأسلوب الخاص بك أمر غير صحيح. من أجل التأكد من أن تتمكن من رؤية أنماط الاتصال في حالات مختلفة ، يجب أن يكون ترتيب النمط الصحيح:
الرابط - زار - تحوم - نشط أو lvha (الاختصار).
المحتوى الأساسي:
كل محدد لديه خصوصية. إذا تم تطبيق اثنين من المحددات على نفس العنصر ، فسيربون المحددات ذات الخصوصية العليا ولديها الأولوية. على سبيل المثال:
p.hithere {color: green ؛} / * الخصوصية = 1،1 * /
p {color: red ؛} / * الخصوصية = 1 * /
يتم عرض أي محتوى فقرة مع فئة الفئة = hithere باللون الأخضر بدلاً من اللون الأحمر. كلا المختارين لديهم مجموعة ألوان ، ولكن المختارين مع خصوصية أعلى سوف يفوز.
كيف تؤثر الفئات الزائفة على الخصوصية؟ لديهم بالضبط نفس قيمة الترجيح ، والأنماط التالية لها نفس قيمة الترجيح المحددة:
ج: الارتباط {color: Blue ؛} / * الخصوصية = 1،1 * /
ج: نشط {اللون: أحمر ؛} / * خصوصية = 1،1 * /
a: hover {color: magenta ؛} / * الخصوصية = 1،1 * /
ج: زيارة {اللون: الأرجواني ؛} / * الخصوصية = 1،1 * /
هذه هي إعدادات نمط للارتباطات التشعبية. في معظم الحالات ، يجب تعيين العديد من هذه الأنماط في نفس الوقت. على سبيل المثال ، يمكن ضبط الارتباط التشعبي غير المرغوب فيه في أنماط مختلفة في كل من تحوم الماوس وتفعيل الماوس عند التحوم والنقر. نظرًا لأن القواعد الثلاثة أعلاه يمكن تطبيقها على الارتباطات التشعبية ، وجميع المحددات لديهم نفس الخصوصية ، ثم وفقًا للقواعد ، يفوز النمط الأخير. لذلك لن يتم عرض النمط النشط أبدًا لأنه مغطى دائمًا بأسلوب التحويم (أي يحوم مفضلة). الآن ، دعونا نحلل ما هو تأثير الماوس التشعبي الذي تمت زيارته ، والنتيجة هي دائمًا أرجوانية :( لأن أسلوبه الذي تمت زيارته له دائمًا الأسبقية على قواعد نمط الدولة الأخرى (بما في ذلك النشط والتحوم).
هذا هو السبب في أن CSS1 يوصي بترتيب النمط:
ج: الرابط
ج: زار
ج: تحوم
ج: نشط
في الواقع ، يمكن تبديل ترتيب الأسلبين الأولين ، لأنه لا يمكن وجود ارتباط تشعبي في نفس الوقت مثل كل من الحالات غير المخلوقة والوصول إليها. (: الرابط يعني غير مرغوب فيه ؛ لا أعرف لماذا لم يتم تعريفه على هذا النحو.)
يتيح CSS2 الآن أن تظهر الفئات الزائفة في مجموعات النقابات ، على سبيل المثال:
ج: زيارة: hover {color: maroon ؛} / * الخصوصية = 2،1 * /
ج: الرابط: hover {color: magenta ؛} / * الخصوصية = 2،1 * /
ج: التحوم: نشط {اللون: cyan ؛} / * خصوصية = 2،1 * /
لديهم نفس الخصوصية ، لكنهم ينطبقون على الوحوش المختلفة بشكل أساسي ، وبالتالي لا تتعارض. يمكنك الحصول على مجموعات تحوم النشطة ، على سبيل المثال.
كيف تفهم الخصوصية التي ينطوي عليها هذا المقال؟ يمكن فهم الخصوصية على أنها سلسلة أرقام غير متصلة ببساطة معًا ، مثال أعلاه:
P.Hithere {color: Green ؛} / * الخصوصية = 11 * /
p {color: red ؛} / * الخصوصية = 1 * /
يبدو أن هذه عملية بسيطة تستند إلى عشري. ومع ذلك ، فإن حساب الخصوصية لا يمكن استخدام الخوارزميات العشرية. على سبيل المثال ، إذا كنت تستخدم 15 محددًا معًا ، فإن قيمها المرجحة المحددة لا تزال أقل من محددات الفئة البسيطة. على سبيل المثال:
.hello {color: red ؛} / * الخصوصية = 10 * /
html body div ul li ol li ul li ol li ul li ol li (اللون: أخضر ؛} / * الخصوصية = 15 * /
10 هو في الواقع خصوصية تتبع 1 ثم صفر ، وليس عشرة. يمكننا استخدام سداسي عشري لوصف قواعد النمط السابقة ، مثل ما يلي:
.hello {color: red ؛} / * الخصوصية = 10 * /
html body div ul li ol li ul li ol li ul li ol li (اللون: أخضر ؛} / * خصوصية = f * /
المشكلة الوحيدة هي أنه إذا كنت ترغب في إضافة اثنين أو أكثر من المحددات إلى قاعدة النمط الثاني ، فيمكنك الحصول على 17 محددة يتم الخلط بينها مرة أخرى. في الواقع ، قد تكون الخصوصية غير محدودة ، لذا لتجنب المزيد من الالتباس ، يوصى باستخدام الفواصل لفصل القيمة المحددة.
يقترح مدير المواقع: كرر حساب القيمة الموزونة للخصوصية. يعكس إعداد موقع الويب CSS قدرتك على التحكم في الصفحة. في تطوير موقع الويب الديناميكي ، فإن حالة CSS مهمة جدًا أيضًا. اقرأ المزيد من المعلومات ، وممارسة المزيد ، وتصميم المزيد من صفحات الويب! إذا كنت تحب هذا الموقع ، فقم بترويجه نيابة عنك! شكرا للقراءة.