- بواسطة x32x01 ||
قابلت ناس كتير بتعمل الغلطة دي 😅
ممكن تكون بسيطة بالنسبة ليك،
بس لو عاوز تتعلم صح وتبقى محترف ركز معايا لو سمحت 👇
بتختار بيها كل العناصر في الصفحة (Selectors).
يعني لما تكتب كده مثلًا:
إنت كده بتقول للمتصفح: "طبّق نوع الخط ده على كل العناصر في الصفحة" 🧩
عناصر زي img أو canvas مثلًا، ليه تخلي المتصفح يعمل شغل زيادة؟ 😵💫
ده ممكن يسبب مشاكل في الأداء لأن المتصفح بيحاول يطبّق الخاصية على حاجات مش محتاجاها أصلاً.
زي كده:
كده هتخلي الموقع أخف 💨، والكود أنضف، والأداء أحسن بكتير 💪
وخلي القاعدة العامة إنك تحط Font-Family في body وتخلي الباقي يورث الخاصية بشكل طبيعي.
ممكن تكون بسيطة بالنسبة ليك،
بس لو عاوز تتعلم صح وتبقى محترف ركز معايا لو سمحت 👇
النجمة (*) في CSS
النجمة دي (*) اسمها Universal Selector 🌍بتختار بيها كل العناصر في الصفحة (Selectors).
يعني لما تكتب كده مثلًا:
CSS:
* {
font-family: 'Cairo', sans-serif;
}إنت كده بتقول للمتصفح: "طبّق نوع الخط ده على كل العناصر في الصفحة" 🧩
فين المشكلة؟ 🤔
طيب سألت نفسك هل كل العناصر محتاجة خاصية Font-Family؟عناصر زي img أو canvas مثلًا، ليه تخلي المتصفح يعمل شغل زيادة؟ 😵💫
ده ممكن يسبب مشاكل في الأداء لأن المتصفح بيحاول يطبّق الخاصية على حاجات مش محتاجاها أصلاً.
الحل الصحيح ✅
الصح 👌 إنك تحط خاصية Font-Family في عنصر body فقط، كده العناصر اللي فعلاً بتحتاج الخط هتورث الخاصية دي تلقائيًا 🧠زي كده:
CSS:
body {
font-family: 'Cairo', sans-serif;
}كده هتخلي الموقع أخف 💨، والكود أنضف، والأداء أحسن بكتير 💪
الخلاصة 🚀
ما تستخدمش * في كل حاجة، استخدمها بحكمة 😉وخلي القاعدة العامة إنك تحط Font-Family في body وتخلي الباقي يورث الخاصية بشكل طبيعي.
التعديل الأخير:
