الهامش 0 السيارات هي واحدة من خصائص كس الرئيسية لإنشاء تخطيط التكيف. يسمح لك بتوسيط العناصر تلقائيا أفقيا. إذا كنت بحاجة إلى محاذاة الكتل إلى وسط الصفحة أو كتلة واحدة داخل أخرى ، فسيصبح الهامش 0 تلقائي أفضل صديق لك.
كيف الهامش 0 العمل التلقائي? يحدد هذا النمط قيما صفرية للهوامش العلوية والسفلية ، ويضبط الوضع التلقائي للهوامش الأفقية. سيتم توسيط الكتلة التي يتم تطبيق الهامش 0 تلقائيا عليها أفقيا بالنسبة للحاوية الأصلية.
مثال:
لتطبيق الهامش 0 تلقائي ، من الضروري أن تحتوي الحاوية التي سيتم محاذاة العنصر فيها على قيمة عرض ثابتة. يمكن أن تكون هذه قيمة ثابتة بالبكسل أو النسب المئوية أو القيم الأخرى. يتطلب تطبيق الهامش 0 تلقائي أيضا عدم ضبط الكتلة التي يتم تطبيق النمط عليها على التعويم ، وعدم ضبط الأصل على محاذاة النص: المركز.
- باستخدام الهامش 0 السيارات يسمح لك لخلق تأثيرات مختلفة على الصفحة. على سبيل المثال ، باستخدام الهامش 0 تلقائي ، يمكنك محاذاة الكتل أفقيا ، أو إنشاء سهم على خلفية الكتلة ، أو إنشاء شريط تمرير صورة متكيف مع التمركز التلقائي. نتيجة استخدام الهامش 0 تلقائي هي محاذاة الكتلة على المحور الأفقي ، مما يجعل صفحة الويب أكثر جمالية وسهولة في الاستخدام.
- ما هو الهامش 0 السيارات ولماذا استخدامه?
- الهامش 0 الوصف التلقائي والمثال
- كيفية استخدام الهامش 0 تلقائي في كود هتمل
- سؤال وجواب
- ما هو الهامش 0 تلقاءي?
كيف الهامش 0 العمل التلقائي?
ما هو الهامش 0 السيارات ولماذا استخدامه?
الهامش 0 السيارات هي خاصية كس التي تستخدم لمحاذاة عناصر كتلة أفقيا ، وتقسيم المساحة الحرة بالتساوي على جانبي العنصر.
الغرض الرئيسي من الهامش 0 تلقائي هو وضع العنصر أفقيا في وسط الصفحة. يكون هذا مفيدا جدا عندما لا نعرف العرض الدقيق لعنصر ما أو نحتاج إلى إنشاء تصميم متكيف.
لاستخدام الهامش 0 تلقائي ، يجب أن يكون لديك عنصر كتلة يحتوي على مجموعة خصائص عرض ثابت. يمكن أن يكون هذا ، على سبيل المثال ، شعبة أو جدول.
لتحديد خاصية الهامش 0 تلقائي لعنصر ما ، يجب عليك استخدام خاصية الهامش المغلق مع القيم 0 للهامش الخارجي في الأعلى والأسفل ، والسيارات للهامش الخارجي على اليسار واليمين. على سبيل المثال:
تقوم السمة التلقائية تلقائيا بتوزيع المساحة الخالية بالتساوي على جانبي العنصر ، مما يسمح لك بمحاذاة أفقيا في المنتصف. يعد هذا مناسبا جدا عند إنشاء تصميم متكيف ، حيث يسمح للعنصر بالتمدد أو الانكماش تلقائيا اعتمادا على حجم شاشة المستخدم.
يعد استخدام الهامش 0 تلقائي مفيدا بشكل خاص عندما تحتاج إلى محاذاة قائمة أو صورة أو عنوان أو أي عنصر كتلة آخر أفقيا.
آمل أن تكون هذه المقالة قد ساعدتك على فهم الهامش 0 التلقائي ولماذا تستخدمه. هذه خاصية كس مفيدة للغاية تجعل من السهل توسيط العناصر على الصفحة وإنشاء تصميم سريع الاستجابة.
الهامش 0 الوصف التلقائي والمثال
الهامش 0 السيارات هي خاصية كس التي تسمح لك تلقائيا مركز عنصر أفقيا على الصفحة. غالبا ما يستخدم هذا لتوسيط عناصر الكتلة مثل ديف.
لاستخدام خاصية الهامش 0 تلقائي ، يجب تعيين العنصر على عرض ثابت. يمكن تعيين هذا باستخدام خاصية العرض أو العرض الأقصى. لتوسيط عنصر ، اضبط قيم الهامش العلوي والهامش السفلي على 0 ، وللتوسط أفقيا ، اضبط قيم الهامش الأيسر والهامش الأيمن على تلقائي.
مثال الاستخدام:
سيتم توسيط هذا النص أفقيا داخل الحاوية.
في هذا المثال ، يحتوي عنصر تقسيم الكتلة مع فئة" الحاوية " على عرض ثابت يبلغ 500 بكسل ويتم توسيطه تلقائيا أفقيا داخل الحاوية الأصلية. سيتم أيضا توسيط النص الموجود داخل الكتلة أفقيا.
يمكن تطبيق هذه الخاصية ليس فقط على عناصر الحظر ، ولكن أيضا على أنواع أخرى من العناصر مثل الجدول ، إمغ ، وغيرها.
كيفية استخدام الهامش 0 تلقائي في كود هتمل
الهامش 0 السيارات في رمز هتمل هي واحدة من الطرق لمحاذاة العناصر أفقيا. يتم استخدامه لتعيين هوامش لعناصر الكتلة من أجل توسيطها أفقيا.
غالبا ما تستخدم هذه الخاصية لتوسيط عناصر الكتلة داخل الحاوية. يستخدم هوامش محسوبة تلقائيا بين الحاوية وعنصر الكتلة بحيث يكون العنصر في المركز.
لاستخدام الهامش 0 تلقائي في كود هتمل ، تحتاج إلى تعيين عرض عنصر الكتلة الذي تريد تطبيق المحاذاة عليه ، وتعيين قيم الهامش الأيسر والهامش الأيمن على تلقائي.
على سبيل المثال ، إذا كان رمز هتمل يحتوي على عنصر الكتلة التالي:
المحتوى
في هذا المثال ، سيكون لعنصر الكتلة عرض 300 بكسل وسيتم توسيطه تلقائيا بسبب الهامش 0 تلقائي.
من المتوقع أن الهامش 0 السيارات يعمل فقط للعناصر ذات العرض المحدد ، وإلا فإن العنصر سيشغل العرض المتاح بالكامل للحاوية.
أيضا ، يمكن استخدام الهامش 0 تلقائي لتوسيط الجداول على الصفحة. على سبيل المثال ، لتوسيط جدول:
العنوان 1
العنوان 2
الخلية 1-1