Web|设置隔行变色的单元格

问题描述

     

表格在日常生活中使用的非常的多，比如excel就是专门用来创建表格的工具，表格就是用来表示一些格式化的数据的，比如：课程表、银行对账单。在网页中也可以来创建出不同的表格。在HTML中，使用table标签来创建一个表格，在table标签中使用tr来表示表格中的一行，有几行就有几个tr，在tr中需要使用td来创建一个单元格。如果表格中的单元格比较多，那么可以设置隔行变色的效果，就能让表格显得清晰和一目了然。设置隔行变色的方法十分简单:可以给偶数(或奇数)行的tr标记都设置上背景色的效果就可以了。

解决方案

     

（1）首先我们应该先写出一个简单的表格，再在这个表格的基础上添加颜色，合并单元格等。

（2）在此基础上，我们可以为表格设置隔行渐变色，以此来突出重点。添加的代码如下：

（3）此时大家可能又会想，要是在表格里添加图片，可能会是表格更加美观。接下来我们简单的插入一张图片。（为了使表格尽可能的美观，我们就变化一下表格样式。

结语

     

兴趣是最好的老师。在学习过程我们难免会遇到自己不愿意学的东西。但是我们可以尝试着将自己喜欢的东西与枯燥的学习相结合。也许这样我们可能会有更多的学习热情。

 where2go 团队

---

   

 

标签：Web,表格,单元格,tr,隔行,设置,变色
来源： https://blog.51cto.com/u_15281984/2959994