💻 الى المصممين والمبرمجين ومطورين الويب

🔴سوف يتم شرح لغات الويب للمبتدئين حتى الاحتراف
🎥 ورات مجانية
🎁 مواقع جاهزة
📚 كتب تصميم وبرمجة

#للسوال_او_الاستفسار_خاص👇👇

╭─┅═ঊঈ⚠ঊঈ═┅─╮
☛ @alhussini_IT ☚
╰─┅═ঊঈ☠ঊঈ═┅─╯

•┈┈┈•❈••✦✾✦••❈•┈┈┈•
❥➺┊@Web_Programming_Design
•┈┈┈•❈••✦✾✦••❈•┈┈┈•

•┈┈┈•❈••✦✾✦••❈•┈┈┈•
❥➺┊@Web_Programming_Design
•┈┈┈•❈••✦✾✦••❈•┈┈┈•

•┈┈┈•❈••✦✾✦••❈•┈┈┈•
❥➺┊@Web_Programming_Design
•┈┈┈•❈••✦✾✦••❈•┈┈┈•

•┈┈┈•❈••✦✾✦••❈•┈┈┈•
❥➺┊@Web_Programming_Design
•┈┈┈•❈••✦✾✦••❈•┈┈┈•

•┈┈┈•❈••✦✾✦••❈•┈┈┈•
❥➺┊@Web_Programming_Design
•┈┈┈•❈••✦✾✦••❈•┈┈┈•

لو تتعامل مع CSS اكيد مرّت عليك الوحدات:
‏[ px - em - rem - % - vh - vw ]

‏- ايش معناهم؟
‏- وايش الفرق بينهم؟

‏حتلاقي الجواب هنا ⬇️


‏1️⃣ وحدة القياس px

‏- وهي اختصار لكلمة Pixel، وحدة قياس ثابتة لا تتغير بتغيّر حجم الشاشة

‏يعني لو أعطيت لنص الحجم 20px حيظهر بالحجم 20px في كل الشاشات

*

‏2️⃣ وحدة القياس em

‏- وحدة قياس نسبية غير ثابتة تعتمد قيمتها بالقياس على الأب المباشر

‏مثلًا عندك div حجم الخط له 20px ( الأب )
‏داخل هذا الـ div لو أنشئت p وضبطت حجم الخط على 1em راح يساوي حجم الخط للعنصر الأب 20px

‏أما لو ضبطته على 2em راح يساوي 40px (ضعف حجم الأب)، وهكذا..

*

‏3️⃣ وحدة القياس rem

‏- وتعني root em وتعتمد في قياسها على الجذر الأساسي في عناصر DOM وهو غالبًا العنصر html ولا تعتمد على الأب المباشر مثل em

‏فمثلًا لو ضبطت حجم الخط في صفحة html على 16px فإن 1rem لأي عنصر داخله راح يساوي 16px و 2rem راح يساوي 32px وهكذا..

*

‏4️⃣ وحدة القياس % ( النسبة المئوية )

‏- مشابهة لحدّ كبير وحدة القياس em فهي تأخذ قيمتها بناءً على العنصر الأب المباشر.

*

‏5️⃣ وحدات القياس vh و vw

‏- لا تعتمد قيمتها على عناصر الصفحة الأعلى منها، إنما على الحجم الكلي لصفحة المتصفح (viewport)

‏- وحدة vh تساوي 1/100 من طول صفحة المتصفح، ووحدة vw تساوي 1/100 من عرض صفحة المتصفح

‏- نستخدمها عادةً في السلايدر، لتكون بكامل حجم الشاشة نعطيها الارتفاع 100vh



يوجد وحدات قياس أخرى لكنها قليلة الاستخدام مثل:
‏pt - in - ex - ch - vmin - vmax - cm - mm

‏ ـــــہہـ٨ـــــــــــــــــــ❥ــہہ00:00:00


╭─┅═ঊঈ⚠ঊঈ═┅─╮
☛ @alhussini_IT ☚
╰─┅═ঊঈ☠ঊঈ═┅─╯

خاصية css overview في Google DevTools خاصية كتير محترمة، بتقدر من خلالها تعرف الألوان المستخدمة ضمن الصفحة، الألوان الأساسية وامور كتير.
‏لتفعيل الخاصية انتقل على inspect ثم settings ثم experiments وبعدها اعمل تفعيل css overview.
‏بعدها رح يظهر tab جديد ادخل عليه واضغط capture css

ـــــہہـ٨ـــــــــــــــــــ❥ــہہ00:00:00


╭─┅═ঊঈ⚠ঊঈ═┅─╮
☛ @alhussini_IT ☚
╰─┅═ঊঈ☠ঊঈ═┅─╯

ملخص لخصائص CSS Position 🔥


•┈┈┈•❈••✦✾✦••❈•┈┈┈•
❥➺┊@Web_Programming_Design
•┈┈┈•❈••✦✾✦••❈•┈┈┈•