حاسبة خصوصية CSS
الصق المحددات، كل واحد في سطر، وشاهد تفصيل خصوصية كل واحد منها مرتبة بالترتيب الذي سيُطبّقها به التتالي (cascade) فعليًا.
تظهر النتائج هنا، مرتبة من الأعلى إلى الأقل خصوصية.
كيف تعمل
يُقسَّم كل محدد عند عناصر الربط ويُحلَّل رمزيًا: تُحسب رموز #id كمعرّفات،
وتُحسب رموز .class و[attr] و:pseudo-class كأصناف،
بينما تُحسب أسماء العناصر المجردة و::pseudo-elements كعناصر.
لا يضيف المحدد الشامل * ولا عناصر الربط مثل > و+
و~ أي شيء. ينتهي كل محدد إلى ثلاثية (المعرّفات، الأصناف، العناصر)،
وهي بالضبط الطريقة التي تُعرّف بها مواصفة CSS نفسها الخصوصية، لذا يطابق الترتيب هنا ما سيفعله
محرك التتالي في متصفحك.
يعمل كل شيء عند كل ضغطة مفتاح داخل جافاسكريبت هذه الصفحة. لصق محددات ورقة أنماط كاملة لا يغادر متصفحك أبدًا.
أسئلة شائعة
كيف تُحسب الخصوصية؟
على شكل أربع مستويات مُعدودة: الأنماط السطرية أولاً، ثم محددات المعرّف (ID)، ثم الأصناف/محددات الخصائص/الفئات الزائفة، ثم محددات العناصر والعناصر الزائفة. تتفوق المستويات الأعلى دائمًا على الأدنى بغض النظر عن عدد محددات المستوى الأدنى المكدّسة، لذا فإن معرّف واحد (0,1,0,0) يتفوق دائمًا على 20 صنفًا (0,0,20,0).
لماذا يتساوى محددان لدي؟
عندما تتساوى الخصوصية تمامًا، تعتمد CSS على ترتيب المصدر: تفوز القاعدة التي تظهر لاحقًا في ورقة الأنماط (أو أُضيفت لاحقًا). تُرتّب هذه الأداة الحالات المتساوية حسب الترتيب الذي لصقتها به، لتطابق هذا السلوك.
هل يُرسل هذا كود CSS الخاص بي إلى أي مكان؟
لا. تُحلَّل المحددات وتُقيَّم بالكامل داخل متصفحك باستخدام محلل رمزي (tokenizer) صغير بلغة جافاسكريبت. لا يُرفع أي شيء.