هذا ضخم

<h1 class="huge huge-spacing">this is huge</h1>

عنوان ضخم

<h1 class="huge">Huge Heading</h1>

عنوان كبير

<h1 class="big "&gtBig Heading</h1>

عنوان H1

عنوان H2

عنوان H3

عنوان H4

عنوان H5

عنوان H6

<span class="small-subtitle">small subtitle</span>

فئات العناوين على العناصر

يمكنك إضافة نمط عنوان لأي عنصر باستخدام الفئات التالية: .h1, .h2, .h3, .h4, .h5, .h6.

تمييز

تمييز بديل

غلف النص في الفئة <em class="hightlighted-text"> ... </em> إلى العنصر لإضافة سطر سفلي سميك. يعمل بشكل أفضل على العناوين الكبيرة. بالإضافة إلى ذلك يمكنك إضافة الفئة lower لتحريك السطر السفلي للأسفل.

<span class="h3"><em class="hightlighted-text">Highlighted</em> Text</span> and <span class="h1"><em class="hightlighted-text lower">Highlighted</em> Text Lower</span>

أنماط تحويل الرابط

نص المحتوى الأكبر

يمكنك جعل نص المحتوى أكبر بإضافة الفئة big-text.

إنها حقيقة معروفة منذ زمن طويل أن القارئ سيشتت انتباهه المحتوى القابل للقراءة لصفحة ما عند النظر إلى تصميمها. الهدف من استخدام لوريم إيبسوم هو أنه يحتوي على توزيع طبيعي أكثر أو أقل للأحرف، على عكس استخدام 'محتوى هنا، محتوى هنا'، مما يجعله يبدو كالإنجليزية قابلة للقراءة. تستخدم العديد من حزم النشر المكتبي ومحررات صفحات الويب الآن لوريم إيبسوم كنص نموذجي افتراضي لها، وسيكشف البحث عن 'لوريم إيبسوم' العديد من مواقع الويب التي لا تزال في مراحلها الأولى. لقد تطورت إصدارات مختلفة على مر السنين، أحيانًا عن طريق الصدفة، وأحيانًا عن قصد (روح الدعابة المحقونة وما شابه ذلك).

محاذاة النص

استخدم الفئات التالية لمحاذاة النص a-center, a-left, a-right

المباعدات

يمكنك بسهولة إضافة بعض المساحة الإضافية بإضافة div مع الفئات التالية: spacer-big, spacer-medium, spacer-regular, spacer-small

<div class="spacer-big">&nbsp;</div>

إخفاء على الهاتف المحمول

يمكنك إخفاء العناصر على الهاتف المحمول أو الجهاز اللوحي بإضافة الفئات التالية إلى العنصر: hide-on-tablet, hide-on-mobile

إزالة المسافات من الأعمدة

أضف الفئة no-spacing أو no-gutters إلى الصف لإزالة الحشو والهامش من الصف والأعمدة.

تسوق الآن

تسوق الآن استكشف

محاذاة عمودية وعرض أقصى

إضافة ox-max-width-500 إلى العنصر سيجعله متمركزًا ويضبط أقصى عرض إلى 500. يمكنك إضافة فئات ox-max-width- من 500 إلى 1000 بخطوة 100. لمحاذاة المحتوى عموديًا استخدم الفئات التالية: col-align-vertical - على عنصر العمود. block-align-vertical - داخل عنصر العمود.

<div class="row">
    <div class="col-md-6">
		<div class="block-align-vertical ox-max-width-500">
		...
		</div>
	</div>
</div>

أو

<div class="row">
    <div class="col-md-6 col-align-vertical">
		<div class="ox-max-width-500">
		...
		</div>
	</div>
</div>

عرض لفترة محدودة

خصم يصل إلى 50%
على المجموعة الجديدة

هناك العديد من المتغيرات المتاحة لنصوص Lorem Ipsum، ولكن الغالبية تعرضت للتعديل بشكل ما، عن طريق روح الدعابة المحقونة، أو الكلمات العشوائية التي لا تبدو قابلة للتصديق ولو قليلاً.

تسوق الآن

مسافة نظيفة، حشو

no-margin - إزالة الهامش من العنصر. no-padding - إزالة الحشو من العنصر. clear-p - إزالة الهامش من جميع عناصر الفقرة.

بالإضافة إلى ذلك، أضف أو أزل الهامش من العناصر اعتمادًا على دقة الشاشة:

ox-margin-lg, ox-margin-lg-no, ox-margin-md, ox-margin-md-no, ox-margin-sm, ox-margin-sm-no, ox-margin, ox-margin-no

التصاق بذيل الصفحة

استخدم هذه الفئة لإزالة تباعد الجزء السفلي للصفحةpage-bottom-padding