CSS通用样式3——表格

基本实例：

在网页制作中，通常会用到表格的鼠标悬停、隔行变色等功能。Bootstrap中提供了一系列表格布局样式，利用该样式可以帮助开发者快速开发出美观的表格，作用于

元素的表格样式如下表所示。

上表中，.table是表格的一个基类，如果想要加其他的样式，都要在.table的基础上去添加。表内的样式可以组合使用，多个样式之间只需使用空格隔开即可，并且都支持.table-dark样式，适用于反转色调。
 Bootstrap对表格进行了优化，通过给

元素应用.table类样式便可以得到一个优化的基本的表格。如下图：

 表头选项

在表头中可以使用thead-light类、thead-dark类分别使<thead>的背景颜色变成浅灰色、深灰色

给表头

添加.thead-light类样式示例

条纹状表格

给

添加.table-striped类样式，可以给表格中元素内的任一行添加斑马条纹样式
 

带边框的表格

给

元素添加.table-bordered类样式，可以将表格中的每个单元格增加边框样式

 无边框的表格

给

元素添加.table-boardeless类样式，得到一个没有边框的表格

鼠标指针悬停

给

元素添加.table-hover类样式，当鼠标放到，元素内的任一行时都会产生悬停的效果

状态类： 

Bootstrap为表格提供了多种状态的样式类，这些状态类的主要作用是为表格中的行或单元格设置不同的背景颜色。状态类设置的是

、

或

元素样式，使用.table-*来设置，可选值包括success、active、primary、secondary、danger、warning、info、light、dark等，同时状态类也适用于反转色调。   响应式表格 通过把任意的table包装在.table-responsive类内，可以创建响应式表格。即当表格水平溢出时出现水平滚动条。   相关阅读: pycharm remote host显示nothing to show Spring源码分析（八）依赖注入源码解析1：autowire自动注入 和 @Autowired注入 JS数组结构转化成树型结构 js的toString方法 鸿蒙开发|鸿蒙系统项目开发前的准备工作 基于JavaFX的扫雷游戏实现（四）——排行榜 linux C/C++ socket编程 10分钟让你熟练Python闭包 ROS python实现乌龟跟随 【校招VIP】前端计算机网络之UDP相关 原文地址：https://blog.csdn.net/qq_66198247/article/details/127751818 最新文章 攻防演习之三天拿下官网站群 数据安全治理学习——前期安全规划和安全管理体系建设 企业安全 | 企业内一次钓鱼演练准备过程 内网渗透测试 | Kerberos协议及其部分攻击手法 0day的产生 | 不懂代码的"代码审计" 安装scrcpy-client模块av模块异常，环境问题解决方案 leetcode hot100【LeetCode 279. 完全平方数】java实现 OpenWrt下安装Mosquitto AnatoMask论文汇总 【AI日记】24.11.01 LangChain、openai api和github copilot 热门文章 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧！！！ 奉劝各位学弟学妹们，该打造你的技术影响力了！ 五年了，我在 CSDN 的两个一百万。 Java俄罗斯方块，老程序员花了一个周末，连接中学年代！ 面试官都震惊，你这网络基础可以啊！ 你真的会用百度吗？我不信 — 那些不为人知的搜索引擎语法 心情不好的时候，用 Python 画棵樱花树送给自己吧 通宵一晚做出来的一款类似CS的第一人称射击游戏Demo！原来做游戏也不是很难，连憨憨学妹都学会了！ 13 万字 C 语言从入门到精通保姆级教程2021 年版 10行代码集2000张美女图，Python爬虫120例，再上征途