جدول پایه
مثال پایه
برای یک ظاهر طراحی اولیه - بالشتک های سبک و فقط تقسیم کننده های افقی - کلاس پایه را اضافه کنید.table به هر <table> .
میکرومین
الماس ZZ
شیرینی لبنیات
چای گوشه
ردیف های راه راه
استفاده از .table-striped برای افزودن راه راه گورخر به هر ردیف جدول در داخل <tbody> .
پریسا محمدی
پریسا محمدی
پریسا محمدیگزینه های سر جدول
از یکی از دو کلاس اصلاح کننده برای ساخت استفاده کنید <thead> ها خاکستری روشن یا تیره به نظر می رسند.
| # | نام | ایمیل | دسترسی |
|---|---|---|---|
| 1 | پریسا | XYZ@Example.com | تجارت |
| 2 | پریسا | XYZ@Example.com | شخصی |
| 3 | پریسا | XYZ@Example.com | غیرفعال |
| 4 | پریسا | XYZ@Example.com | تجارت |
| 5 | پریسا | XYZ@Example.com | شخصی |
ردیف های قابل شناور
استفاده از .table-striped برای افزودن راه راه گورخر به هر ردیف جدول در داخل <tbody> .
| # | نام | نام خانوادگی | نام کاربری |
|---|---|---|---|
| 1 | پریسا | محمدی | @mdo |
| 2 | پریسا | محمدی | @fat |
| 3 | لاری پرنده | ||
جدول تیره
متن عالی شما اینجا می رود.
| # | نام | نام خانوادگی | نام کاربری |
|---|---|---|---|
| 1 | پریسا | محمدی | @mdo |
| 2 | پریسا | محمدی | @fat |
| 3 | پریسا | محمدی |
کلاس های متنی
از کلاس های متنی برای رنگ آمیزی ردیف های جدول یا سلول های فردی استفاده کنید.
| # | نام | نام خانوادگی | نام کاربری |
|---|---|---|---|
| 1 | پریسا | محمدی | @mdo |
| 2 | پریسا | محمدی | @fat |
| 3 | پریسا | محمدی | |
| 4 | پریسا | محمدی | @mdo |
| 5 | پریسا | محمدی | @fat |
| 6 | پریسا | محمدی | |
| 7 | پریسا | محمدی | @fat |
| 8 | پریسا | محمدی | |
| 9 | پریسا | محمدی | @fat |
| 10 | پریسا | محمدی |
جدول زیرنویس ها
یک <caption> مانند یک عنوان برای یک جدول عمل می کند. این به کاربران دارای صفحه خوان کمک می کند تا جدولی را پیدا کنند و بفهمند درباره چیست و تصمیم بگیرند که آیا می خواهند آن را بخوانند یا خیر.
| # | نام | نام خانوادگی | نام کاربری |
|---|---|---|---|
| 1 | پریسا | محمدی | @mdo |
| 2 | پریسا | محمدی | @fat |
| 3 | پریسا | محمدی |
جدول کوچک
افزودن .table-sm برای فشرده‌تر کردن میزها با نصف کردن لایه‌های سلولی.
| # | نام | نام خانوادگی | نام کاربری |
|---|---|---|---|
| 1 | پریسا | محمدی | @mdo |
| 2 | پریسا | محمدی | @fat |
| 3 | لاری پرنده | ||