`
flyzhouke
  • 浏览: 19386 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

简单隔行换色

 
阅读更多
 
表格隔行换色,节省代码的好方法
<style>
.db { border-collapse:collapse;}
.db tr{ background-color:expression('#F8F8F8,#EFEFEF'.split(',')[rowIndex%2]); }
</style>
<table width="100%" border="1" class="db">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
 
上面是每一行隔行换色每两行一循环,下面是每一行隔行换色,每八行一循环
<style>
.db tr{
background-color:expression('#000000,#333333,#555555,#777777,#999999,#bbbbbb,#dddddd,#ffffff'.split(',')[rowIndex%8]);
}
</style>

 

分享到:
评论

相关推荐

    jquery 实现隔行换色

    在网页设计中,为了提高数据表格的可读性,我们经常需要实现隔行换色的效果。这使得用户在浏览大量数据时能更容易地区分每一行,从而减轻视觉疲劳。jQuery,一个广泛使用的JavaScript库,提供了方便的方式来实现这个...

    jquery 隔行换色

    在网页设计中,隔行换色是一种常见的视觉增强技巧,用于提高表格或列表的可读性。`jQuery`,作为一款强大的JavaScript库,为开发者提供了便捷的方法来实现这样的效果。本教程将详细介绍如何使用`jQuery`实现隔行换色...

    jquery实现隔行换色特效代码.zip

    接下来,我们创建一个简单的HTML表格结构,用于展示隔行换色的效果: ```html 数据1 数据2 &lt;!-- 添加更多行 --&gt; ``` 现在,我们可以编写jQuery代码来实现隔行换色。这里的关键是选择器和CSS样式修改。在...

    JS实现li隔行换色

    简单的代码实现华丽的效果,您所需的。隔行换色。

    隔行换色.rar隔行换色.rar

    标题中的“隔行换色”可能是指在电子文档或网页设计中的一种视觉效果,通常用于减少屏幕闪烁,提高阅读舒适度。在某些显示设备上,连续的文本行可能会因为刷新率的原因产生轻微的交错,导致视觉上的不清晰。为了解决...

    一天搞定jQuery(二)——使用jQuery表格的隔行换色

    jQuery的灵活性和易用性使得隔行换色这样的常见任务变得简单。通过学习和实践,你可以掌握更多jQuery的技巧,进一步提升网页交互和用户体验。 在提供的`jQueryDemo`文件中,可能包含了实现这个功能的完整HTML、CSS...

    Repeater隔行换色示例(vs2010做的)

    在这个示例中,我们将深入探讨如何在Visual Studio 2010中使用C#实现`Repeater`控件的隔行换色效果。 首先,我们需要了解`Repeater`的基本结构。`Repeater`没有内置的布局或样式,它的外观完全依赖于其ItemTemplate...

    超简单表格隔行换色+鼠标经过变色(ie6,ie7,ff)

    下面我们将详细探讨如何实现“超简单表格隔行换色+鼠标经过变色”这一功能,并兼容IE6、IE7以及Firefox。 首先,让我们从隔行换色开始。这是一种常见的CSS技巧,可以通过使用CSS伪类`:nth-child()`来实现。这个选择...

    Gridview隔行换色

    通过上述分析,我们可以看到,使用JavaScript实现GridView的隔行换色是一项既实用又相对简单的技术。它不仅能提升界面的美观度,还能增强数据的可读性和用户的交互体验。开发者可以根据实际需求调整颜色设置,以适应...

    基于Jquery的表格隔行换色,移动换色,点击换色插件

    标题和描述中提到的知识点主要集中在如何使用jQuery来实现表格的动态样式变化功能,包括隔行换色、移动换色以及点击换色。首先,我们将介绍这些效果的实现原理和技术细节。 ### 1. jQuery基础知识 jQuery是一个快速...

    jQuery 隔行换色

    在网页设计中,为了提升用户体验,常常需要对表格或者列表数据进行视觉优化,其中隔行换色是一种常见的方法。jQuery,作为一个轻量级的JavaScript库,提供了强大的DOM操作功能,使得实现这一效果变得简单易行。本文...

    隔行换色和鼠标经过样式和title提示效果代码

    这个示例创建了一个简单的表格,包含了隔行换色、鼠标经过时的背景变化以及单元格的`title`提示功能。用户在浏览时可以清晰地看到每一行的区别,同时通过鼠标悬停获取更多细节信息,大大提升了用户体验。 总结来说...

    VC++ 让ListCtrl隔行换色

    "VC++ 让ListCtrl隔行换色"这个主题涉及的是如何在ListCtrl的报告视图中实现行的交替颜色,以提高用户界面的可读性和美观性。 首先,要实现这一功能,你需要理解MFC中的CListCtrl类,它是对Windows API中的ListView...

    Excel实现隔行换色的2种方法图文介绍.docx

    Excel 2021引入了一项名为“套用表格格式”的功能,使得隔行换色变得更加简单快捷。具体步骤如下: 1. 首先,确保你需要改变颜色的表格区域被选中。这可以通过点击并拖动鼠标来完成,或者通过按住Ctrl键选择非连续...

    表格table隔行换色以及点击整行变色.rar

    本教程将详细讲解如何实现表格的隔行换色以及点击整行变色的效果,这两种技术可以提升用户体验,使表格内容更加清晰易读。 首先,让我们讨论表格隔行换色。这种效果通常被称为“斑马线”效果,因为它使得交替的行...

    Excel实现隔行换色的2种方法【会计实务操作教程】.pptx

    在Excel中,隔行换色是一项实用的技巧,特别是在处理大量数据时,它可以提高数据的可读性和视觉吸引力。以下将详细介绍两种实现隔行换色的方法。 1. 使用套用表格格式功能 这个功能自Excel 2010版本开始引入,操作...

    javascript 隔行换色函数代码

    综上所述,通过编写一个简单的JavaScript函数,我们能够动态地为网页中的元素添加类名,实现隔行换色的视觉效果。这不仅提高了页面的用户体验,还展示了JavaScript在动态操作样式方面的强大能力。

    表格隔行换色,真是方便,摘自经典论坛

    表格隔行换色是一种常见的设计技巧,它能提升数据可读性,帮助用户更清晰地分辨不同的数据行,尤其在处理大量数据时。这篇来自经典论坛的博文中,作者分享了如何实现表格隔行换色的方法,下面我们将详细探讨这一技术...

    原生javascript实现隔行换色

    在网页设计中,为了提高数据表格的可读性,经常采用隔行换色的方法,使得用户更容易区分每一行的信息。本篇文章将详细讲解如何使用原生JavaScript实现这一功能,无需依赖任何外部库如jQuery。 首先,我们需要理解...

    ListView数据项隔行换色控制实现

    为了提高用户体验,我们经常需要对ListView的数据项进行视觉优化,比如隔行换色。这样可以使用户在浏览长列表时更容易区分不同的数据行,增加可读性。这篇博客"ListView数据项隔行换色控制实现"详细介绍了如何在...

Global site tag (gtag.js) - Google Analytics