مسج الشبكة موبايل
مسج موبايل الشبكة تخطيط
يوفر مسج موبايل انهيار تخطيط المغلق القائم. ومع ذلك، على الأجهزة النقالة، والنظر في عرض شاشة الهاتف ضيقة، وعموما نحن لا نوصي باستخدام تخطيط العمود مصنفة حسب نوع.
ولكن في بعض الأحيان كنت تريد يتم ترتيب العناصر الصغيرة (مثل الأزرار أو علامات التبويب الملاحة) جنبا إلى جنب، كما هو الحال في الجدول. في هذه الحالة، فمن المستحسن استخدام شكل عمود من الباطن.
أعمدة الشبكة هي متساوية العرض (مجموع 100٪)، ليس لها حدود، الخلفية، الهامش أو الحشو.
هناك تتوفر أربعة شبكة التخطيط:
| الطبقة الشبكة | صف | عرض العمود | مراسلة | أمثلة |
|---|---|---|---|---|
| واجهة المستخدم الشبكة-منفردا | 1 | 100٪ | واجهة المستخدم كتلة واحد | محاولة |
| واجهة المستخدم الشبكة واحد | 2 | 50٪ / 50٪ | واجهة المستخدم كتلة واحد | ب | محاولة |
| واجهة المستخدم الشبكة-ب | 3 | 33٪ / 33٪ / 33٪ | واجهة المستخدم كتلة واحد | ب | ج | محاولة |
| واجهة المستخدم الشبكة-ج | 4 | 25٪ / 25٪ / 25٪ / 25٪ | واجهة المستخدم كتلة واحد | ب | ج | د | محاولة |
| واجهة المستخدم الشبكة د | 5 | 20٪ / 20٪ / 20٪ / 20٪ / 20٪ | واجهة المستخدم كتلة واحد | ب | ج | د | البريد | محاولة |
 | في حاويات العمود، عناصر فرعية لها الدرجة كما اجهة المستخدم كتلة واحد | ب | ج | د | البريد اعتمادا على عدد من الأعمدة. العائمة الجانب التوالي من قبل الجانب. أمثلة 1: فئة من (اثنين تخطيطات) واجهة الشبكة، يجب عليك تحديد واجهة المستخدم كتلة واحد واجهة المستخدم لبنة-ب من اثنين من عناصر فرعية. أمثلة 2: فئة من واجهة المستخدم الشبكة-ب (ثلاثة تخطيطات)، يجب إضافة واجهة المستخدم كتلة واحد، ui- -بلوك ب واجهة المستخدم كتلة-ج من العناصر الفرعية الثلاث. |
|---|
شبكة مخصصة
باستخدام CSS، يمكنك تخصيص كتل العمود:
أمثلة
.ui كتلة واحد، .ui كتلة-ب، .ui كتلة-ج {
لون الخلفية: lightgray.
الحدود: 1PX الصلبة السوداء.
الطول: 100px؛
الخط الوزن: جريئة؛
مواءمة النصوص: المركز؛
الحشو: 30px؛
}
</ النمط>
محاولة »
يمكنك أيضا تخصيص باستخدام كتل النمط المضمن:
<div class="ui-block-a" style="border: 1px solid black;"><span>Text..</span></div>
خط متعددة
في العمود، يمكنك أيضا أن عدة أسطر.
ملاحظة: واجهة المستخدم كتلة واحد في الدرجة دائما إنشاء خط جديد:
أمثلة
<فئة الدرجة = "واجهة المستخدم كتلة واحد"> <SPAN> بعض النصوص </ SPAN> </ div>
<فئة الدرجة = "واجهة المستخدم لبنة-ب"> <SPAN> بعض النصوص </ SPAN> </ div>
<فئة الدرجة = "واجهة المستخدم كتلة-ج"> <SPAN> بعض النصوص </ SPAN> </ div>
<فئة الدرجة = "واجهة المستخدم كتلة واحد"> <SPAN> بعض النصوص </ SPAN> </ div>
<فئة الدرجة = "واجهة المستخدم لبنة-ب"> <SPAN> بعض النصوص </ SPAN> </ div>
<فئة الدرجة = "واجهة المستخدم كتلة واحد"> <SPAN> بعض النصوص </ SPAN> </ div>
</ div>
محاولة »
الشبكة تستجيب
في الشاشة الصغيرة، والكثير جدا لا ينصح في الجانب التوالي من قبل الجانب زر (اختصار النص).
ونحن إنشاء شبكة تستجيب للاستخدام في فئات واجهة المستخدم استجابة الحاويات: