المواضيع مسج موبايل
يوفر مسج موبايل اثنين من الأساليب موضوع مختلف، من "أ" إلى "ب" - كل أزرار تحت عنوان، أشرطة الأدوات، وما إلى ذلك ألوان كتلة المحتوى غير متناسقة، والمؤثرات البصرية ليست هي نفسها بالنسبة لكل موضوع.
بواسطة تعيين السمة عنصر موضوع البيانات يمكن تخصيص مظهر من التطبيق:
<a href="#" class="ui-btn ui-btn-a|b">按钮</a>
| قيمة | وصف | أمثلة |
|---|---|---|
| ل | الصفحة نص أسود على رأسه بخلفية رمادية والقاع النص سوداء على خلفية رمادية خلفية الزر الأسود نص رمادي أزرار تفعيل وصلات إلى نص أبيض على خلفية زرقاء إدخال مدخلات مربع نائبا قيمة السمة هو رمادي فاتح، قيمة سوداء | محاولة |
| ب | الصفحة خلفية سوداء مع نص أبيض في الجزء السفلي من الرأس هي نص أبيض على خلفية سوداء زر نص أبيض تنشيط أزرار خلفية الفحم وصلات إلى نص أبيض على خلفية زرقاء إدخال مدخلات مربع نائبا قيمة السمة هو رمادي فاتح، القيمة البيضاء | محاولة |
زر نمط استخدام الطبقة = "واجهة المستخدم BTN"، وذلك باستخدام "واجهة المستخدم BTN واحد | ب" غير نشط زر إعدادات الدرجة من (الافتراضي) أو الأسود:
<a href="#" class="ui-btn ui-btn-a|b">按钮</a>
 | موضوع "A" على غرار لمعظم العناصر، عناصر فرعية وعادة ما ترث النمط من العنصر الأصلي. |
|---|
قمم وقيعان الموضوع
أمثلة
<div data-role="footer" data-theme="b"></div>
محاولة »
الجزء السفلي من رأس موضوع مربع الحوار
أمثلة
<div data-role="header" data-theme="b"></div>
<div data-role="footer" data-theme="b"></div>
</div>
محاولة »
زر الموضوعات
الرموز موضوع
الموضوع البوب
مواضيع زر في أسفل الرأس و
أمثلة
<a href="#" class="ui-btn ui-btn-b"> الرئيسية </A>
<H1> مرحبا بكم في صفحتي الرئيسية </ H1>
<a href="#" class="ui-btn"> البحث </A>
</ div>
<div-دور البيانات = "تذييل">
<a href="#" class="ui-btn ui-btn-b"> اتبعني في الفيسبوك </A>
<a href="#" class="ui-btn"> لي على متابعة التغريد </A>
<a href="#" class="ui-btn ui-btn-b"> لي على متابعة إينستاجرام </A>
</ div>
محاولة »
موضوع شريط التنقل
أمثلة
<h1>文本头部</h1>
<div data-role="navbar">
<ul>
<li><a href="#" data-icon="home" data-theme="a">Button 1</a></li>
<li><a href="#" data-icon="arrow-r">Button 2</a></li>
<li><a href="#" data-icon="arrow-r">Button 3</a></li>
<li><a href="#" data-icon="search" data-theme="a">Button 4</a></li>
</ul>
</div>
</div>
محاولة »
لوحة موضوع
أزرار قابلة للطي الموضوع والمحتوى
أمثلة
<h1>Click me - I'm collapsible!</h1>
<p>I'm the expanded content.</p>
</div>
محاولة »
قائمة الموضوع
أمثلة
<li><a href="#">List Item</a></li>
<li><a href="#">List Item</a></li>
<li data-theme="a"><a href="#">List Item</a></li>
<li><a href="#">List Item</a></li>
</ul>
محاولة »
زر تقسيم الموضوع موضوع
موضوع قائمة انهيار
أمثلة
<ul data-role="listview">
<li><a href="#">Agnes</a></li>
</ul>
</div>
محاولة »
نموذج الموضوعات
أمثلة
<input type="text" name="text" id="name" data-theme="b">
<label for="colors">Choose Favorite Color:</label>
<select id="colors" name="colors" data-theme="b">
<option value="red">Red</option>
<option value="green">Green</option>
<option value="blue">Blue</option>
</select>
محاولة »
شكل للطي الموضوع موضوع
أمثلة
<legend>Click me - I'm collapsible!</legend>
محاولة »
إضافة موضوع جديد
مسج المحمول يمكن أن تضيف مواضيع جديدة في صفحة النقال.
عن طريق تعديل ملف CSS لإضافة أو تعديل موضوع جديد (إذا قمت بتنزيل مسج موبايل). تحتاج فقط إلى نسخ وحدة الأسلوب، ومن ثم إعادة أحرف اسم الفئة الأوامر (تشيكوسلوفاكيا)، وإضافة لونك المفضل ونمط الخط.
يمكنك أيضا إضافة وثيقة HTML المتعلقة نمط جديد، شريط الأدوات إضافة فئة: واجهة المستخدم-bar- (من الألف إلى الياء)، إضافة فئات محتوى النص: واجهة المستخدم بين الهيئة (من الألف إلى الياء)، إضافة فئات الصفحة: واجهة المستخدم، صفحة theme- ( من الألف إلى الياء).
أمثلة
.ui-bar-f {
color: red;
background-color: yellow;
}
.ui-body-f {
font-weight: bold;
color: white;
background-color: purple;
}
.ui-page-theme-f {
font-weight: bold;
background-color: green;
}
</style>
محاولة »
| في الإصدارات السابقة من مسج جوال، عنصر باستخدام جافا سكريبت وراثة الأنماط موضوع الأم. إلى الإصدار 1.4، إطار أكثر تركيزا لتحسين الأداء، لم يعد يستخدم جافا سكريبت لترث، ولكن باستخدام النقي CSS. فريق مسج موبايل لهذا خلقت أداة لمعالجة وشكل رولر . يمكنك استخدام هذه الأداة لترقية موضوع القديم، مما يجعلها متوافقة مع الإصدار الجديد. |
|---|