CSS复习之用CSS设置表格样式

秒速五厘米 2022-05-25 10:23 1086阅读 0赞

#### 今日目录： ####

1、设置表格的边框

2、设置表格的宽度

3、设置表格隔行还色

4、设置表格列样式

5、设置鼠标经过时变色效果

#### 一、设置表格的边框 ####

Border：设置表格边框；  
Border-collapse：设置边框分离，合并 默认是 separate(分离) collapse 合并；  
Border-spacing ：设置单元格的间距；  
Padding：设置单元格内容和边框之间的距离；

![70][]

#### 二、设置表格的宽度 ####

Table-layout  
默认 auto 自动方式，根据单元格的内容自动调整宽度；  
Fixed 固定方式 表格宽度固定；

![70 1][]

#### 三、设置表格隔行还色 ####

![70 2][]

#### 四、设置表格列样式 ####

![70 3][]

#### 五、设置鼠标经过时变色效果 ####

![70 4][]

添加小编微信可以获取免费资源，二维码

![70 5][]

要用到的工具，关注 公众号直接免费获取：

![70 6][]

[70]: /images/20220525/3d2a5abefc3546b8b9f72072b02c29be.png
[70 1]: /images/20220525/dfc2220444274694b013290058dae602.png
[70 2]: /images/20220525/0a78b77a08b5495db51d1b80bb8d0978.png
[70 3]: /images/20220525/a9ebd6c4a0574bda85310d2dedcde176.png
[70 4]: /images/20220525/989fc81f3ce94bde87cd0ed854c5d071.png
[70 5]: /images/20220525/5a122f849b43457180242b7cf2c3ce45.png
[70 6]: /images/20220525/0fb35c1dbe974739b6434370bb1e8e89.png

发表评论取消回复

表情：

评论列表（有 0 条评论，1086人围观）

还没有评论，来说两句吧...

相关阅读

相关如何使用 CSS 设置 HTML 表格样式

在 Web 开发的早期，HTML 表格非常基础，缺乏广泛的样式选项。然而，今天，大多数表格的样式都旨在为用户创造更美观和更实用的体验。 CSS 为样式表提供了许多属性。这些属

浅浅的花香味﹌/ 2023年09月28日 08:38/ 0 赞/ 35 阅读

相关 css表格样式

表格：有自适应功能行：设置宽度无效，可设置高度，最小高度，最大高度列：设置高度[无效]：可以设置宽度：最小宽度，最大宽度

不念不忘少年蓝@/ 2023年06月12日 09:19/ 0 赞/ 66 阅读

相关 css 表格样式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DT

梦里梦外;/ 2022年08月24日 04:06/ 0 赞/ 488 阅读

相关 CSS复习之用CSS设置列表样式

今日目录 1、设置列表符号 2、设置列表图片符号 3、创建简单导航菜单一、设置列表符号 !

短命女/ 2022年05月25日 10:25/ 0 赞/ 376 阅读

相关 CSS复习之用用 CSS 设置超链接样式

今日目录 1、使用 CSS 伪类别来设置超链接样式 2、创建按钮式超链接一、使用 CSS 伪类别来设置超链接样式

待我称王封你为后i/ 2022年05月25日 10:24/ 0 赞/ 418 阅读

相关 CSS复习之用CSS设置表格样式

今日目录： 1、设置表格的边框 2、设置表格的宽度 3、设置表格隔行还色 4、设置

秒速五厘米/ 2022年05月25日 10:23/ 0 赞/ 1087 阅读

相关 CSS复习之用用 CSS 设置背景颜色和背景图像

今日目录 1、设置背景颜色 2、设置背景图像 3、设置背景图像平铺 4、设置背景图

我会带着你远行/ 2022年05月25日 10:09/ 0 赞/ 382 阅读

相关 CSS复习之用CSS设置图像效果

今日目录： 1、设置图片边框 2、设置图片大小及缩放 3、图文混排 4、设置图片与文字的

拼搏现实的明天。/ 2022年05月25日 10:08/ 0 赞/ 275 阅读

相关 CSS复习之用CSS设置文本样式

今日目录 1、设置字体样式 2、设置文字的倾斜效果 3、设置文字的加粗效果 4、设

墨蓝/ 2022年05月25日 09:54/ 0 赞/ 317 阅读

相关 BootStrap复习之全局CSS样式

今日目录： 1、排版样式 2、代码样式 3、表格样式 4、表单样式

布满荆棘的人生/ 2022年05月24日 07:45/ 0 赞/ 341 阅读