مكوِّن Jumbotron (شاشة الإعلانات) في إطار العمل Bootstrap
اذهب إلى التنقل
اذهب إلى البحث
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.
استخدم مكوِّن Jumbotron (شاشة الإعلان) للتركيز على محتوى ذي أهميّة في صفحة الويب.
مكوِّن مرن وخفيف يمكنه التمدّد على كامل إطار العرض لإبراز رسائل دعائيّة أساسيّة على الموقع.
<div class="jumbotron">
<h1 class="display-4">مرحبا أيّها العالم!</h1>
<p class="lead">هذا مثال على محتوى شديد الأهميّة، مكوِّن يشبه شاشات الإعلانات لجذب انتباه أكبر لمحتوى مميَّز.
</p>
<hr class="my-4">
<p>يستخدم المكوِّن أصنافًا خدميّة للخطوط والتباعد لنشر المحتوى ضمن الحاويّة الأعرض.</p>
<p class="lead">
<a class="btn btn-primary btn-lg" href="#" role="button">اقرأ المزيد.</a>
</p>
</div>
طبِّق الصنف المعدِّل .jumbotron-fluid مع الصنف .jumbotron وأضف في الداخل الصنف .container أو .container-fluid للحصول مكوِّن Jumbotron مائع (fluid).
<div class="jumbotron jumbotron-fluid">
<div class="container">
<h1 class="display-4">مكوِّن Jumbotron مائع</h1>
<p class="lead">هذا صنف Jumbotron مُعَدَّل يشغل المساحة الأفقيّة للعنصُر الأب كاملة.</p>
</div>
</div>