السلام عليكم انا لسة مبتدئى فى التصميم درست css3 html ولاكن فى مشكلة مدوخانى هوى ازى نقسم الضيف يعنى بمعنى ازاى كل ضيف بياخد width تبعه هل فى عملية حسابية لما بعطى width للديف ياريت حد يفهمنى ازاى بيتم تقسيم المساحات داخل الديف الرئيسى وشكراا ليكم بجد
عايز حد يساعدنى ضرورى فى تصميم الويب ولكم كل الشكر والتقدير
يمكنك أن تستخدم المقاسات بإستعمال دالة calc في css ستجد من هنا شرح واف لها
وأيضا الوحدة تكون إما بالنسبة المئوية أو px ويفضل النسبة المئوية حتى يكون الشكل responsive أيضا بإستعمال خواص flexbox ستحصل على layout مناسب لجميع الأحجام بعيدا عن مشاكل width ستجد شرح وأمثلة لها من هنا:
تمام يعنى حضرتك هضرب مثال بسيط
ahmed
navbar
فل نفترض انى هبدا اقسم الضيفات فى السى اس
الديف الرئيسى بياخد100%
الديف الثانى بياخد 60%
الديف الثالث بياخد 60%
بيقا التقسيمة دى صح ولا خطا
لو كل هذه الديفات على مستوى واحد فلا يمكنك أن تتخطى حاجز 100% حتى لا تظهر العناصر خارج النافذة.
يعني div1 يأخد 50%
والتاني 25%
والتالث 25%
أولاً عليك فهم جزئيتين في css أولاً إذا أعطيت إلى div خاصية display:block فلن تستطيع أن تقسم 2 div على سطر واحد ويجب أن يكون الأثنين يملكوا خاصية display: inline لكي تتم تقسم div بجانب بعض ويمكنك تقسيمهم بواسطة الرقم في المئة بمعنى إعطاء div 40% width وإعطاء div أخر 60% وهذا لكي يكون ريسبونسيف لأن يوجد أختلاف أحجام شاشات توجد شاشات 1200px ويوجد 1400px ويوجد 600px فلكي لا تعيد الضبط في جميع الشاشات بواسطة px عليك استخدام هذه الطريقة أكثر احترافية لك وأيضاً أنصحك بتعلم خاصية flexbox الأن تعمل على احتراف تقسم الشاشات في جميع الشاشات طولاً وعرضاً سوف يكون معك صندوق مرن تستطيع أن تشكله وتعدل عليه في جميع divs بإعطاء div أب هذه الخاصية أنصحك بتعلم flexbox الأن وهذه أهم المصادر :
تسلم ي هندسة فهمتك جدا باالنسبة لااعطاء margin يتطلبة تقسيم النسبة المئوية مثل الديف ولا لا يعنى مثلاا فى ديف اعطيته 60%مارجين
وديف او عنصر ثانى اعطيته 80%مارجين هل كدا صح ولا لازم النسبة المئوية تنقسم
نسبة ال margin تكون محسوبة من النسبة الكلية ال 100% و لا يمكنك تخطيها.
بمعنى أن يكون عرض الأول 50% و نعطيه margin بقيمة 10% و بذلك يتبق لنا 40% من العرض الكلى يمكن استخدامهم ك width و margin لل div الثاني كأن يكون عرضة 35% مثلًا و له margin بقيمة 5%
اه تمام فهمت طيب بالنسبة لل padding بردك بيتم حسابة من النسبة المئوية ولا ملهوش علاقة باعرض الديف
طيب حضرتك اديت padding اوmargin باالبكسل بدل النسبة المئوية محتاج بردك احسب باالبكسل ولا بدى البكسل من غير حساب
توضيح: ال padding تحسب من الأب
أي الحواف الداخلية للأب عليك طرحها من العرض الكلي للأب و هذا ما يبقى للأبناء ..
بصراحة الموضع صعب باالنسبالى حضرتك مفيش فيديوهات تشرح ازاى نقسم الديفات و padding بطريقة صحيحة ومبسطة ولك كل الشكر
الخاصية width في CSS تُحدِّد عرض أحد العناصر، وتستخدم هذه الخاصية افتراضيًا لتحديد عرض منطقة المحتوى (content area)، لكن إن كانت الخاصية box-sizing مضبوطة إلى border-box فستُحدِّد عرض العنصر بدءًا من الحافة الخارجية للإطار.
تطبق هذه الخاصية على جميع العناصر، ما عدا العناصر السطرية غير المُستبدَلة (non-replaced inline elements)، وأعمدة الجداول، ومجموعات الأعمدة.
يمكنك الإطلاع على توثيق موسوعة حسوب من الرابط التالي للفهم بكشل أكبر.
التعليقات