کلاس های table در بوت استرپ
کلاس های جدول
از کلاس های زیر می توانید برای استایل بندی کردن جدول ها استفاده کنید:
| Class | توضیحات | مثال |
|---|---|---|
| table. |
به هر جدول یک استایل ابتدایی را اضافه می کند( یک padding سبک و تنها تقسیم کننده های افقی). |
امتحان کنید |
| table-striped. |
خط های راه راه را به هر ردیف در داخل <tbody> اضافه می کند(در IE8 قابل دسترسی نمی باشد). |
امتحان کنید |
| table-bordered. |
کادرها را به تمام اطراف و داخل جدول اضافه می کند. |
امتحان کنید |
| table-hover. |
به یک منطقه از جدول، در داخل <tbody>، خاصیت hover را می دهد. |
امتحان کنید |
| table-condensed. |
جدول را با نصف کردن padding خانه ها، متراکم تر می کند. |
امتحان کنید |
| ترکیب کردن تمام کلاس های جدول | امتحان کنید | |
کلاس های مربوط به <tr> و <th> و <td>
از کلاس های زیر می توانید برای رنگ کردن ردیف ها و خانه های جداول استفاده کنید:
| Class | توضیحات | مثال |
|---|---|---|
| active. |
اعمال عمل hover به یک ردیف یا سلول ویژه. |
امتحان کنید |
| success. |
یک عمل موفقیت آمیز یا مثبت را مشخص می کند. |
امتحان کنید |
| info. |
یک عمل یا اطلاعات خنثی را مشخص می کند. |
امتحان کنید |
| warning. |
یک اخطار قابل توجه را مشخص می کند. |
امتحان کنید |
| danger. |
یک عمل خطرناک یا منفی را مشخص می کند. |
امتحان کنید |
جدول های واکنش گرا
کلاس table-responsive. در واقع یک جدول واکنش گرا را مشخص می کند. سپس جدول می تواند در دستگاه های کوچک(زیر 768px) به صورت افقی، اسکرول شود. در هنگام مشاهده ی جدول در هر وسیله که عرض آن بیش از 768px باشد، هیچ تفاوتی وجود نخواهد داشت.
مثال (جدول های css بوتسترپ)
<table class="table">
...
</table>
</div>
خودتان امتحان کنید »
- نوشته شده توسط احسان عباسی
- بازدید: 15132
