好看的table-css样式

更新时间:2023-12-06 16:29:53 阅读: 评论:0

2023年12月6日发(作者:育英二外)

-

好看的table-css样式

好看的table-css样式

1.单像素边框css表格

源代码:

Info Header 1Info Header 2Info Header 3
Text 1AText 1BText 1C
Text 2AText 2BText 2C

2.带背景图的CSS样式表格

这个样式和和上面的差不多,只是多了背景图,的视觉上会好看不少。源代码:

Info Header 1Info Header 2Info Header 3
Text 1AText 1BText 1C
Text 2AText 2BText 2C

3. 自动换整行颜色的CSS样式表格(需要用到JS)

  这个CSS表格会自动切换每一行的颜色,这种呈现方式,在我们编辑一个数据庞大的表格时,非常好用。

  源代码:

Info Header 1Info Header 2Info Header 3
Text 1AText 1BText 1C
Text 2AText 2BText 2C
Text 3AText 3BText 3C
Text 4AText 4BText 4C
Text 5AText 5BText 5C

 4. 鼠标悬停高亮的CSS样式表格 (需要JS)

  纯CSS显示表格高亮在IE中显示有问题,所以这边使用了JS来做高亮。

  注意:不要定义格子的背景色。

  源代码:

Info Header 1Info Header 2Info Header 3
Item 1AItem 1BItem 1C
Item 2AItem 2BItem 2C
Item 3AItem 3BItem 3C
Item 4AItem 4BItem 4C
Item 5AItem 5BItem 5C

-

好看的table-css样式

本文发布于:2023-12-06 16:29:53,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/zhishi/a/1701851393237652.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

本文word下载地址:好看的table-css样式.doc

本文 PDF 下载地址:好看的table-css样式.pdf

标签:表格   样式   颜色   格子   定义   需要
留言与评论(共有 0 条评论)
   
验证码:
推荐文章
排行榜
Copyright ©2019-2022 Comsenz Inc.Powered by © 实用文体写作网旗下知识大全大全栏目是一个全百科类宝库! 优秀范文|法律文书|专利查询|