کلاس پایه را اضافه کنید.table to any <table>, then extend with our optional modifier classes or custom styles. All table styles are not inherited in Bootstrap, meaning any nested tables can be styled independent from the parent.

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده ها	داده ها	داده ها

از کلاس‌های متنی برای رنگ‌آمیزی جداول، ردیف‌های جدول یا سلول‌های جداگانه استفاده کنید (مثلاً.table-primary).

#	سر	سر	سر
1	داده ها	داده ها	داده ها

#	سر	سر	سر
1	داده ها	داده ها	داده ها

#	سر	سر	سر
1	داده ها	داده ها	داده ها

#	سر	سر	سر
1	داده ها	داده ها	داده ها

#	سر	سر	سر
1	داده ها	داده ها	داده ها

#	سر	سر	سر
1	داده ها	داده ها	داده ها

#	سر	سر	سر
1	داده ها	داده ها	داده ها

#	سر	سر	سر
1	داده ها	داده ها	داده ها

اضافه کردن.table-hover to enable a hover state on table rows within a <tbody>.

این ردیف های شناور را می توان با نوع راه راه نیز ترکیب کرد:

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده ها	داده ها	داده ها

یک ردیف یا سلول جدول را با افزودن a برجسته کنید.table-active class.

سبک‌های حاشیه، سبک‌های فعال و انواع جدول توسط جداول تودرتو به ارث نمی‌رسند.

#	سر	سر	سر
1	داده ها	داده ها	داده ها
عنوان فرعی عنوان فرعی عنوان فرعی آ زیر داده ها زیر داده ها ب زیر داده ها زیر داده ها سی زیر داده ها زیر داده ها
3	داده ها	داده ها	داده ها

از کلاس های اصلاح کننده استفاده کنید.table-{color} to <thead>.

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
پا	پا	پا	پا

سلول های جدول از<thead> are always vertical aligned to the bottom. Table cells in <tbody> inherit their alignment from <table> and are aligned to the the top by default.

اضافه کردن.table-bordered for borders on all sides of the table and cells.

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده های طولانی		داده ها

اضافه کردن.table-borderless for a table without borders.

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده های طولانی		داده ها

استفاده کنید.table-striped to add zebra-striping to any table row within the <tbody>.

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده ها	داده ها	داده ها

استفاده کنید.table-striped-columns to add zebra-striping to any table column.

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده ها	داده ها	داده ها

این کلاس ها را می توان به انواع جدول نیز اضافه کرد:

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده ها	داده ها	داده ها

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده ها	داده ها	داده ها

اضافه کردن.table-sm to make any .table more compact by cutting all cell padding in half.

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده های طولانی		داده ها

یک حاشیه ضخیم تر، تیره تر بین گروه های جدول اضافه کنید-<thead>, <tbody>, and <tfoot>—with .table-group-divider. Customize the color by changing the border-top-color (which we don’t currently provide a utility class for at this time).

#	سر	سر	سر
1	داده ها	داده ها	داده ها
2	داده ها	داده ها	داده ها
3	داده های طولانی		داده ها

جداول خود را همیشه پاسخگو کنید، استفاده کنید.table-responsive for horizontally scrolling tables.

استفاده کنید.table-responsive{-sm|-md|-lg|-xl|-xxl} as needed to create responsive tables up to a particular breakpoint. From that breakpoint and up, the table will behave normally and not scroll horizontally.

آ<caption> functions like a heading for a table. It helps users with screen readers to find a table and understand what it’s about and decide if they want to read it.

List of users

#	سر	سر	سر
1	داده ها	داده ها	داده ها

شما همچنین می توانید قرار دهید<caption> on the top of the table with .caption-top.