.class 基本表格
<!DOCTYPE HTML><HTML lang="en"head> Meta charset="UTF-8"Title>demo1</name="vIEwport" content="wIDth=device-wIDth,initial-scale=1,shrink-to-fit=no"link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/CSS/bootstrap.min.CSS"script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.Js"></script="https://cdn.staticfile.org/popper.Js/1.15.0/umd/popper.min.Js"="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/Js/bootstrap.min.Js"bodydiv class="jumbotron text-center"> h1>my first bootstrap pagep>i am learning bootstrapdiv> ="container-fluID"="row"> ="col-sm-12" style="background:lavender;"> table ="table"> thead> tr> th>Firstname>Lastname>Emailtbodytd>John>Doe>john@example.com>Mary>Moe>mary@example.com>July>Dooley>july@example.comtableHTML>
.table-striped 条纹表格
="table table-striped">
.table-bordered 带边框的表格
="table table-bordered">
.table-hover 带鼠标悬停效果的表格
="table table-hover">
.table-tark 黑色背景表格
="table table-dark">
.table-derk .table-striped 黑色条纹表格
="table table-dark table-striped">
.table-dark .table-hover 带鼠标悬停效果的黑色表格
="table table-dark table-hover">
指定意义的颜色类
tr ="table-info"="table-primary"="table-success"="table-warning"="table-danger"="table-active"="table-secondary"="table-light"="table-dark">
.table-sm 较小的表格
> ="table table-sm">
.table-responsive 响应式表格
="col-sm-4"="table table-responsive">
总结
以上是内存溢出为你收集整理的Bootstrap4 表格练习全部内容，希望文章能够帮你解决Bootstrap4 表格练习所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）