جداول پایه
مثال اساسی
برای یک ظاهر طراحی اولیه - بالشتک های سبک و فقط تقسیم کننده های افقی - کلاس پایه را اضافه کنید.table
to any <table>
.
نام | شماره تلفن | تاریخ تولد | فعال؟ |
---|---|---|---|
ریسا دی. پیرسون | 336-508-2157 | 24 جولای 1950 |
|
آن سی تامپسون | 646-473-2057 | 25 ژانویه 1959 |
|
پل جی. دوست | 281-308-0793 | 1 سپتامبر 1939 |
|
لیندا جی اسمیت | 606-253-1207 | 3 مه 1962 |
|
\u003ctable class\u003d\
جدول معکوس
همچنین میتوانید رنگها را با متن روشن روی پسزمینههای تیره معکوس کنید.table-dark
.
نام | شماره تلفن | تاریخ تولد | فعال؟ |
---|---|---|---|
ریسا دی. پیرسون | 336-508-2157 | 24 جولای 1950 |
|
آن سی تامپسون | 646-473-2057 | 25 ژانویه 1959 |
|
پل جی. دوست | 281-308-0793 | 1 سپتامبر 1939 |
|
شان سی نگوین | 269-714-6825 | 5 فوریه 1994 |
|
\u003ctable class\u003d\
ردیف های راه راه
استفاده کنید.table-striped
to add zebra-striping to any table row
within the <tbody>
.
گزینه های سر جدول
از یکی از دو کلاس اصلاح کننده برای ساخت استفاده کنید<thead>
s appear light or dark gray.
تولید - محصول | پیک | روند | وضعیت |
---|---|---|---|
کمر بلند ASOS Ridley | فدرال اکسپرس |
|
تحویل داده شده |
پیراهن سبک وزن مارکو | DHL |
|
ارسال شد |
پیراهن نیم آستین | روشن |
|
سفارش دریافت شد |
ژاکت سبک | فدرال اکسپرس |
|
تحویل داده شده |
\u003ctable class\u003d\
ردیف های قابل شناور
اضافه کردن.table-hover
to enable a hover state on table rows within a <tbody>
.
تولید - محصول | قیمت | تعداد | میزان |
---|---|---|---|
کمر بلند ASOS Ridley | 79.49 دلار | 82 عدد | 6518.18 دلار |
پیراهن سبک وزن مارکو | 128.50 دلار | 37 عدد | 4754.50 دلار |
پیراهن نیم آستین | 39.99 دلار | 64 عدد | 2559.36 دلار |
ژاکت سبک | 20.00 دلار | 184 عدد | 3,680.00 دلار |
\u003ctable class\u003d\
میز کوچک
اضافه کردن.table-sm
to make tables more compact by cutting cell padding in half.
تولید - محصول | قیمت | تعداد | میزان |
---|---|---|---|
کمر بلند ASOS Ridley | 79.49 دلار | 82 عدد | 6518.18 دلار |
پیراهن سبک وزن مارکو | 128.50 دلار | 37 عدد | 4754.50 دلار |
پیراهن نیم آستین | 39.99 دلار | 64 عدد | 2559.36 دلار |
ژاکت سبک | 20.00 دلار | 184 عدد | 3,680.00 دلار |
کفش مارکو | 28.49 دلار | 69 عدد | 1965.81 دلار |
کمر بلند ASOS Ridley | 79.49 دلار | 82 عدد | 6518.18 دلار |
\u003ctable class\u003d\
میز حاشیه دار
اضافه کردن.table-bordered
for borders on all sides of the table and cells.
جدول رنگ حاشیه دار
اضافه کردن.table-bordered
& .border-primary
can be added to change colors.
همیشه پاسخگو
در هر نقطه شکست، استفاده کنید.table-responsive
for horizontally scrolling tables. Use
.table-responsive{-sm|-md|-lg|-xl}
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.
# | سرفصل | سرفصل | سرفصل | سرفصل | سرفصل | سرفصل | سرفصل | سرفصل | سرفصل |
---|---|---|---|---|---|---|---|---|---|
1 | سلول | سلول | سلول | سلول | سلول | سلول | سلول | سلول | سلول |
2 | سلول | سلول | سلول | سلول | سلول | سلول | سلول | سلول | سلول |
3 | سلول | سلول | سلول | سلول | سلول | سلول | سلول | سلول | سلول |
\u003ctable class\u003d\
مثال پایه بدون حاشیه
اضافه کردن.table-borderless
for a table without borders.
نام | شماره تلفن | تاریخ تولد | فعال؟ |
---|---|---|---|
ریسا دی. پیرسون | 336-508-2157 | 24 جولای 1950 |
|
آن سی تامپسون | 646-473-2057 | 25 ژانویه 1959 |
|
پل جی. دوست | 281-308-0793 | 1 سپتامبر 1939 |
|
لیندا جی اسمیت | 606-253-1207 | 3 مه 1962 |
|
\u003ctable class\u003d\
جدول بدون حاشیه معکوس
اضافه کردن.table-borderless
for a table without borders.
نام | شماره تلفن | تاریخ تولد | فعال؟ |
---|---|---|---|
ریسا دی. پیرسون | 336-508-2157 | 24 جولای 1950 |
|
آن سی تامپسون | 646-473-2057 | 25 ژانویه 1959 |
|
پل جی. دوست | 281-308-0793 | 1 سپتامبر 1939 |
|
شان سی نگوین | 269-714-6825 | 5 فوریه 1994 |
|
\u003ctable class\u003d\
جداول فعال
یک ردیف یا سلول جدول را با افزودن a برجسته کنید.table-active
class.
نام | شماره تلفن | تاریخ تولد | فعال؟ |
---|---|---|---|
ریسا دی. پیرسون | 336-508-2157 | 24 جولای 1950 |
|
آن سی تامپسون | 646-473-2057 | 25 ژانویه 1959 |
|
پل جی. دوست | 281-308-0793 | 1 سپتامبر 1939 |
|
لیندا جی اسمیت | 606-253-1207 |
|
|
پل جی. دوست | 281-308-0793 | 1 سپتامبر 1939 |
|
\u003ctable class\u003d\
لانه سازی
سبکهای حاشیه، سبکهای فعال و انواع جدول توسط جداول تودرتو به ارث نمیرسند.
نام | شماره تلفن | تاریخ تولد | فعال؟ | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
ریسا دی. پیرسون | 336-508-2157 | 24 جولای 1950 |
|
||||||||||||
|
|||||||||||||||
لیندا جی اسمیت | 606-253-1207 | 2 سپتامبر 1939 |
|
\u003ctable class\u003d\