代码拉取完成，页面将自动刷新
Fork 仓库
加载中
确定同步？
同步操作将从 笔下光年/Light Year Admin Using Iframe v5 强制同步，此操作会覆盖自 Fork 仓库以来所做的任何修改，且无法恢复！！！
确定后同步将在后台操作，完成时将刷新页面，请耐心等待。
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204
<!DOCTYPE html>
<html lang="zh">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
<meta name="keywords" content="LightYear,LightYearAdmin,光年,后台模板,后台管理系统,光年HTML模板">
<meta name="description" content="Light Year Admin V5是一个基于Bootstrap v5.1.3的后台管理系统的HTML模板。">
<title>表格 - 光年(Light Year Admin V5)后台管理系统模板</title>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<link rel="stylesheet" type="text/css" href="css/materialdesignicons.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/style.min.css">
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<div class="card">
<header class="card-header"><div class="card-title">表格</div></header>
<div class="card-body">
<h6>基本示例</h6>
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>庄子</td>
<td>庄子</td>
<td>古文典籍</td>
</tr>
<tr>
<th scope="row">2</th>
<td>道德经</td>
<td>老子</td>
<td>古文典籍</td>
</tr>
<tr>
<th scope="row">3</th>
<td>能面杀人事件</td>
<td>高木彬光</td>
<td>悬疑小说</td>
</tr>
</tbody>
</table>
<h6>情景状态类</h6>
<table class="table">
<thead>
<tr>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">北京悠悠馆</th>
<td>陈舜臣</td>
<td>历史小说</td>
</tr>
<tr class="table-primary">
<th scope="row">甲午战争</th>
<td>陈舜臣</td>
<td>历史小说</td>
</tr>
<tr class="table-secondary">
<th scope="row">神兽之爪</th>
<td>陈舜臣</td>
<td>历史小说</td>
</tr>
<tr class="table-success">
<th scope="row">帝国的软肋：大汉王朝四百年</th>
<td>陈舜臣</td>
<td>历史小说</td>
</tr>
<tr class="table-danger">
<th scope="row">春秋战国：戈马钟鼓杀与盟</th>
<td>陈舜臣</td>
<td>历史小说</td>
</tr>
<tr class="table-warning">
<th scope="row">龙凤之国</th>
<td>陈舜臣</td>
<td>历史小说</td>
</tr>
<tr class="table-info">
<th scope="row">大唐帝国之隋乱唐盛三百年</th>
<td>陈舜臣</td>
<td>历史小说</td>
</tr>
<tr class="table-light">
<th scope="row">一个陌生女人的来信</th>
<td>斯蒂芬·茨威格</td>
<td>国外名著</td>
</tr>
<tr class="table-dark">
<th scope="row">七十二朝人物演义</th>
<td>佚名</td>
<td>白话小说</td>
</tr>
</tbody>
</table>
<h6>条纹状表格 <code>.table-striped</code></h6>
<table class="table table-striped">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>庄子</td>
<td>庄子</td>
<td>古文典籍</td>
</tr>
<tr>
<th scope="row">2</th>
<td>道德经</td>
<td>老子</td>
<td>古文典籍</td>
</tr>
<tr>
<th scope="row">3</th>
<td>能面杀人事件</td>
<td>高木彬光</td>
<td>悬疑小说</td>
</tr>
</tbody>
</table>
<table class="table table-dark table-striped">
<thead>
<tr>
<th>#</th>
<th>书籍名称</th>
<th>作者</th>
<th>分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>庄子</td>
<td>庄子</td>
<td>古文典籍</td>
</tr>
<tr>
<th scope="row">2</th>
<td>道德经</td>
<td>老子</td>
<td>古文典籍</td>
</tr>
<tr>
<th scope="row">3</th>
<td>能面杀人事件</td>
<td>高木彬光</td>
<td>悬疑小说</td>
</tr>
</tbody>
</table>
<table class="table table-success table-striped">
<thead>
<tr>
<th>#</th>
<th>书籍名称</th>
<th>作者</th>
<th>分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>庄子</td>
<td>庄子</td>
<td>古文典籍</td>
</tr>
<tr>
<th scope="row">2</th>
<td>道德经</td>
<td>老子</td>
<td>古文典籍</td>
</tr>
<tr>
<th scope="row">3</th>
<td>能面杀人事件</td>
<td>高木彬光</td>
<td>悬疑小说</td>
</tr>
</tbody>
</table>
<h6>鼠标悬停 <code>.table-hover</code></h6>
<p>添加 <code>.table-hover</code> 可在 <code><tbody></code> 中的表行上启用悬停状态。</p>
<table class="table table-hover">
<thead>
<tr>
<th>#</th>
<th>书籍名称</th>
<th>作者</th>
<th>分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>理智与情感</td>
<td>简·奥斯汀</td>
<td>国外名著</td>
</tr>
<tr>
<th scope="row">2</th>
<td>浪子神鹰</td>
<td>陈青云</td>
<td>武侠小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td>风中之路</td>
<td>川端康成</td>
<td>当代小说</td>
</tr>
</tbody>
</table>
<table class="table table-hover table-dark">
<thead>
<tr>
<th>#</th>
<th>书籍名称</th>
<th>作者</th>
<th>分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>理智与情感</td>
<td>简·奥斯汀</td>
<td>国外名著</td>
</tr>
<tr>
<th scope="row">2</th>
<td>浪子神鹰</td>
<td>陈青云</td>
<td>武侠小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td>风中之路</td>
<td>川端康成</td>
<td>当代小说</td>
</tr>
</tbody>
</table>
<table class="table table-striped table-hover">
<thead>
<tr>
<th>#</th>
<th>书籍名称</th>
<th>作者</th>
<th>分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>理智与情感</td>
<td>简·奥斯汀</td>
<td>国外名著</td>
</tr>
<tr>
<th scope="row">2</th>
<td>浪子神鹰</td>
<td>陈青云</td>
<td>武侠小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td>风中之路</td>
<td>川端康成</td>
<td>当代小说</td>
</tr>
</tbody>
</table>
<h6>状态类</h6>
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr class="table-active">
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2" class="table-active">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<table class="table table-dark">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr class="table-active">
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2" class="table-active">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<h6>表格边框</h6>
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<p>可以使用 <code>border</code> 类定义不同颜色的边框。</p>
<table class="table table-bordered border-primary">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<h6>无边框表格</h6>
<table class="table table-borderless">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<table class="table table-dark table-borderless">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<h6>紧缩表格 <code>.table-sm</code></h6>
<table class="table table-sm">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<table class="table table-dark table-sm">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<h6>垂直对齐方式</h6>
<p><code><thead></code> 的表格单元格始终与底部垂直对齐。<code><tbody></code> 中的表格单元格从 <code><Table></code> 继承其对齐方式，默认情况下与顶部对齐。使用垂直对齐类在需要时重新对齐。</p>
<div class="table-responsive">
<table class="table align-middle">
<thead>
<tr>
<th scope="col" class="w-25">标题一</th>
<th scope="col" class="w-25">标题二</th>
<th scope="col" class="w-25">标题三</th>
<th scope="col" class="w-25">标题四</th>
</tr>
</thead>
<tbody>
<tr>
<td>此单元格从表格上继承 <code>vertical-align: middle;</code> 。</td>
<td>此单元格从表格上继承 <code>vertical-align: middle;</code> 。</td>
<td>此单元格从表格上继承 <code>vertical-align: middle;</code> 。</td>
<td>这里是一些占位符文本，旨在占用相当多的垂直空间，以演示垂直对齐在前面的单元格中如何工作。第44回 金毛犼爱财设巧计 山西雁贪功坠牢笼</td>
</tr>
<tr class="align-bottom">
<td>此单元格从表格行上继承 <code>vertical-align: bottom;</code> 。</td>
<td>此单元格从表格行上继承 <code>vertical-align: bottom;</code> 。</td>
<td>此单元格从表格行上继承 <code>vertical-align: bottom;</code> 。</td>
<td>这里是一些占位符文本，旨在占用相当多的垂直空间，以演示垂直对齐在前面的单元格中如何工作。第45回 徐良临险地多亏好友 石仁入贼室搭救宾朋</td>
</tr>
<tr>
<td>此单元格从表格上继承 <code>vertical-align: middle;</code> 。</td>
<td>此单元格从表格上继承 <code>vertical-align: middle;</code> 。</td>
<td class="align-top">这个单元格与顶部对齐。</td>
<td>这里是一些占位符文本，旨在占用相当多的垂直空间，以演示垂直对齐在前面的单元格中如何工作。第46回 入破庙人鬼乱闹 奔古寺差解同行</td>
</tr>
</tbody>
</table>
</div>
<h6>嵌套</h6>
<p>嵌套表格不会继承边框样式、状态样式和表格情景语境。</p>
<table class="table table-striped table-bordered">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">作者</th>
<th scope="col">价格</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>论语</td>
<td>孔子弟子及再传弟子</td>
<td>¥：19.80</td>
</tr>
<tr>
<td colspan="4">
<table class="table mb-0">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">价格</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">A</th>
<td>鲁论语</td>
<td>¥：19.80</td>
</tr>
<tr>
<th scope="row">B</th>
<td>齐论语</td>
<td>¥：19.80</td>
</tr>
<tr>
<th scope="row">C</th>
<td>古论语</td>
<td>¥：19.80</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<th scope="row">3</th>
<td>西厢记</td>
<td>王实甫</td>
<td>¥：12.00</td>
</tr>
</tbody>
</table>
<h6>表头</h6>
<p>与表和黑色表类似，使用修饰符类 <code>.table-light</code> <code>.table-dark</code>让其显示为浅灰色或黑色。</p>
<table class="table">
<thead class="table-light">
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td>天神下凡</td>
<td>烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<table class="table">
<thead class="table-dark">
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td>天神下凡</td>
<td>烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<h6>表脚</h6>
<table class="table">
<thead class="table-light">
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td>天神下凡</td>
<td>烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>表脚</td>
<td>表脚</td>
<td>表脚</td>
<td>表脚</td>
</tr>
</tfoot>
</table>
<h6>题注</h6>
<p><code><caption></code> 的功能类似于表格的标题。它帮助屏幕阅读器的用户找到一个表格，了解它的内容，并决定他们是否想要阅读它。</p>
<table class="table">
<caption>书籍清单</caption>
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<p>您还可以使用 <code>.caption-top</code> 将 <caption> 放在表格顶部。</p>
<table class="table caption-top">
<caption>书籍清单</caption>
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名称</th>
<th scope="col">作者</th>
<th scope="col">分类</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>简单爱</td>
<td>董晓磊</td>
<td>青春校园</td>
</tr>
<tr>
<th scope="row">2</th>
<td>主教杀人事件</td>
<td>范·达恩</td>
<td>悬疑小说</td>
</tr>
<tr>
<th scope="row">3</th>
<td colspan="2">天神下凡 · 烽火戏诸侯</td>
<td>玄幻仙侠</td>
</tr>
</tbody>
</table>
<h6>始终响应式的</h6>
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">作者</th>
<th scope="col">国籍</th>
<th scope="col">分类</th>
<th scope="col">库存</th>
<th scope="col">价格</th>
<th scope="col">商店</th>
<th scope="col">折扣</th>
<th scope="col">是否有赠礼</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>钦差大臣</td>
<td>果戈理</td>
<td>俄国</td>
<td>国外名族</td>
<td>125</td>
<td>36.00</td>
<td>五玉书店</td>
<td>9折</td>
<td>无</td>
</tr>
<tr>
<th scope="row">2</th>
<td>西厢记</td>
<td>王实甫</td>
<td>中国</td>
<td>古文典籍</td>
<td>26</td>
<td>18.00</td>
<td>广场书店</td>
<td>9.5折</td>
<td>有</td>
</tr>
<tr>
<th scope="row">3</th>
<td>儒林外史</td>
<td>吴敬梓</td>
<td>中国</td>
<td>古文典籍</td>
<td>39</td>
<td>22.00</td>
<td>大点书店</td>
<td>8.5折</td>
<td>无</td>
</tr>
</tbody>
</table>
</div>
<h6>特定断点</h6>
<p>默认</p>
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">作者</th>
<th scope="col">国籍</th>
<th scope="col">分类</th>
<th scope="col">库存</th>
<th scope="col">价格</th>
<th scope="col">商店</th>
<th scope="col">折扣</th>
<th scope="col">是否有赠礼</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>钦差大臣</td>
<td>果戈理</td>
<td>俄国</td>
<td>国外名族</td>
<td>125</td>
<td>36.00</td>
<td>五玉书店</td>
<td>9折</td>
<td>无</td>
</tr>
<tr>
<th scope="row">2</th>
<td>西厢记</td>
<td>王实甫</td>
<td>中国</td>
<td>古文典籍</td>
<td>26</td>
<td>18.00</td>
<td>广场书店</td>
<td>9.5折</td>
<td>有</td>
</tr>
<tr>
<th scope="row">3</th>
<td>儒林外史</td>
<td>吴敬梓</td>
<td>中国</td>
<td>古文典籍</td>
<td>39</td>
<td>22.00</td>
<td>大点书店</td>
<td>8.5折</td>
<td>无</td>
</tr>
</tbody>
</table>
</div>
<p><code>.table-responsive-sm</code></p>
<div class="table-responsive-sm">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">作者</th>
<th scope="col">国籍</th>
<th scope="col">分类</th>
<th scope="col">库存</th>
<th scope="col">价格</th>
<th scope="col">商店</th>
<th scope="col">折扣</th>
<th scope="col">是否有赠礼</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>钦差大臣</td>
<td>果戈理</td>
<td>俄国</td>
<td>国外名族</td>
<td>125</td>
<td>36.00</td>
<td>五玉书店</td>
<td>9折</td>
<td>无</td>
</tr>
<tr>
<th scope="row">2</th>
<td>西厢记</td>
<td>王实甫</td>
<td>中国</td>
<td>古文典籍</td>
<td>26</td>
<td>18.00</td>
<td>广场书店</td>
<td>9.5折</td>
<td>有</td>
</tr>
<tr>
<th scope="row">3</th>
<td>儒林外史</td>
<td>吴敬梓</td>
<td>中国</td>
<td>古文典籍</td>
<td>39</td>
<td>22.00</td>
<td>大点书店</td>
<td>8.5折</td>
<td>无</td>
</tr>
</tbody>
</table>
</div>
<p><code>.table-responsive-md</code></p>
<div class="table-responsive-md">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">作者</th>
<th scope="col">国籍</th>
<th scope="col">分类</th>
<th scope="col">库存</th>
<th scope="col">价格</th>
<th scope="col">商店</th>
<th scope="col">折扣</th>
<th scope="col">是否有赠礼</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>钦差大臣</td>
<td>果戈理</td>
<td>俄国</td>
<td>国外名族</td>
<td>125</td>
<td>36.00</td>
<td>五玉书店</td>
<td>9折</td>
<td>无</td>
</tr>
<tr>
<th scope="row">2</th>
<td>西厢记</td>
<td>王实甫</td>
<td>中国</td>
<td>古文典籍</td>
<td>26</td>
<td>18.00</td>
<td>广场书店</td>
<td>9.5折</td>
<td>有</td>
</tr>
<tr>
<th scope="row">3</th>
<td>儒林外史</td>
<td>吴敬梓</td>
<td>中国</td>
<td>古文典籍</td>
<td>39</td>
<td>22.00</td>
<td>大点书店</td>
<td>8.5折</td>
<td>无</td>
</tr>
</tbody>
</table>
</div>
<p><code>.table-responsive-lg</code></p>
<div class="table-responsive-lg">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">作者</th>
<th scope="col">国籍</th>
<th scope="col">分类</th>
<th scope="col">库存</th>
<th scope="col">价格</th>
<th scope="col">商店</th>
<th scope="col">折扣</th>
<th scope="col">是否有赠礼</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>钦差大臣</td>
<td>果戈理</td>
<td>俄国</td>
<td>国外名族</td>
<td>125</td>
<td>36.00</td>
<td>五玉书店</td>
<td>9折</td>
<td>无</td>
</tr>
<tr>
<th scope="row">2</th>
<td>西厢记</td>
<td>王实甫</td>
<td>中国</td>
<td>古文典籍</td>
<td>26</td>
<td>18.00</td>
<td>广场书店</td>
<td>9.5折</td>
<td>有</td>
</tr>
<tr>
<th scope="row">3</th>
<td>儒林外史</td>
<td>吴敬梓</td>
<td>中国</td>
<td>古文典籍</td>
<td>39</td>
<td>22.00</td>
<td>大点书店</td>
<td>8.5折</td>
<td>无</td>
</tr>
</tbody>
</table>
</div>
<p><code>.table-responsive-xl</code></p>
<div class="table-responsive-xl">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">作者</th>
<th scope="col">国籍</th>
<th scope="col">分类</th>
<th scope="col">库存</th>
<th scope="col">价格</th>
<th scope="col">商店</th>
<th scope="col">折扣</th>
<th scope="col">是否有赠礼</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>钦差大臣</td>
<td>果戈理</td>
<td>俄国</td>
<td>国外名族</td>
<td>125</td>
<td>36.00</td>
<td>五玉书店</td>
<td>9折</td>
<td>无</td>
</tr>
<tr>
<th scope="row">2</th>
<td>西厢记</td>
<td>王实甫</td>
<td>中国</td>
<td>古文典籍</td>
<td>26</td>
<td>18.00</td>
<td>广场书店</td>
<td>9.5折</td>
<td>有</td>
</tr>
<tr>
<th scope="row">3</th>
<td>儒林外史</td>
<td>吴敬梓</td>
<td>中国</td>
<td>古文典籍</td>
<td>39</td>
<td>22.00</td>
<td>大点书店</td>
<td>8.5折</td>
<td>无</td>
</tr>
</tbody>
</table>
</div>
<p><code>.table-responsive-xxl</code></p>
<div class="table-responsive-xxl">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">书籍名</th>
<th scope="col">作者</th>
<th scope="col">国籍</th>
<th scope="col">分类</th>
<th scope="col">库存</th>
<th scope="col">价格</th>
<th scope="col">商店</th>
<th scope="col">折扣</th>
<th scope="col">是否有赠礼</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>钦差大臣</td>
<td>果戈理</td>
<td>俄国</td>
<td>国外名族</td>
<td>125</td>
<td>36.00</td>
<td>五玉书店</td>
<td>9折</td>
<td>无</td>
</tr>
<tr>
<th scope="row">2</th>
<td>西厢记</td>
<td>王实甫</td>
<td>中国</td>
<td>古文典籍</td>
<td>26</td>
<td>18.00</td>
<td>广场书店</td>
<td>9.5折</td>
<td>有</td>
</tr>
<tr>
<th scope="row">3</th>
<td>儒林外史</td>
<td>吴敬梓</td>
<td>中国</td>
<td>古文典籍</td>
<td>39</td>
<td>22.00</td>
<td>大点书店</td>
<td>8.5折</td>
<td>无</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/popper.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/main.min.js"></script>
</body>
</html>
举报
请认真填写举报原因，尽可能描述详细。
请选择举报类型
误判申诉
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化