Jquery改变TABLE样式几种效果

"https://www.360docs.net/doc/642579037.html,/TR/xhtml1/DTD/xhtml1-strict.dtd">

cssrain - demo

Demo1--隔行,滑动,点击变色.

姓名	暂住地
张山	男	浙江宁波
李四	女	浙江杭州
王五	男	湖南长沙
找六	男	浙江温州
Rain	男	浙江杭州
MAXMAN	女	浙江杭州

Demo2--隔行,滑动,点击变色.+ 多选框选中的行变色.

姓名	暂住地
张山	男	浙江宁波
李四	女	浙江杭州
王五	男	湖南长沙
找六	男	浙江温州
Rain	男	浙江杭州
MAXMAN	女	浙江杭州

Demo3--隔行,滑动,点击变色.+ 单选框选中的行变色.

姓名	性别	暂住地
张山	男	浙江宁波
李四	女	浙江杭州
王五	男	湖南长沙
找六	男	浙江温州
Rain	男	浙江杭州
MAXMAN	女	浙江杭州

html设置表格和页面一样大

竭诚为您提供优质文档/双击可除html设置表格和页面一样大篇一：html表格的设置宜宾学院教案 _网页设计与制作_课程 -1– -2– -3– 篇二：html创建网页表格的基本原则和方法 html创建网页表格的基本原则和方法将一定的内容按特定的行、列规则进行排列就构成了表格。无论在日常生活和工作中，还是在网页设计中，表格通常都可以使信息更容易理解。html具有很强的表格功能，使用户可以方便地创建出各种规格的表格，并能对表格进行特定的修饰，从而使网页更加生动活泼。html表格模型使用户可以将各种数据(包括文本、预格式化文本、图像、链接、表单、表单域以及其他表格等)排成行和列，从而获得特定的表格效果。表格在网页设计中的地位非常重要，可以说如果您表格用不好的话，就不可能设计出出色的网页。大多数

初学者一开始就接触表格，对表格都有一定的了解，但是要实现真正细致甚至强大的功能，仔细理解table的代码结构至关重要！我们将在这里详细介绍表格各种常用的标记、技巧以及表格使用中的问题，了解和掌握了这些内容，你将发现，table原来是这样的亲切易用! 一、创建基本的表格一个表由＜table＞开始，＜/table＞结束，表的内容由＜tr＞,＜th＞和＜td＞定义。＜tr＞说明表的一个行，表有多少行就有多少个＜tr＞；＜th＞说明表的列数和相应栏目的名称，有多少个栏就有多少个＜th＞；＜td＞则填充由＜tr＞和＜t h＞组成的表格。表格重要的基本标记不多，但每个标记都有很多的属性，考虑到一下子把这些属性都列出来，可能让初学者感到无从下手，所以我们还是从表格的外观(即浏览器中显示的表格的样式)来了解最基本的属性。在讲解之前，我们先来看看表格的基本构造。下图是一个3行3列的表格。这里面有两个概念要弄明白：表格与单元格。他们的关系是整体与局部的关系，如同砌墙的砖和砌好的墙一样。在上面3行3列的表格中一共有9个单元格。由于我们后面将提到的表格属性和单元格属性有很多是相同的，所以一定要分清楚。前面已经说过表格的最基本标记为＜table＞、＜

html,表格边框透明

竭诚为您提供优质文档/双击可除 html,表格边框透明篇一：html的table边框技巧-html表格table边框样式美化运用css语法美化表格table注：除非特殊声明，本文所举各例插入的表格的cellspacing、cellpadding、border 值均为0。例一：1px表格很多人热衷于制作1px表格，于是发明了各式各样的方法，用css做起来可就灵活的多。如果要制作一个1x1的1px表格只要简单定义一下边框值就可以了。我们首先用dreamweaver插入一个1x1表格，宽度为50，然后在该表格table或者td中定义border:1solidteal,所做的表格的效果如下：但是要制作一个非1x1的表格（如2x2）就稍微麻烦些，因为如果直接定义td样式 border:1solidteal，则显示的效果如下：你会发现表格外框为1px，而里面则变成了2px了，这是由于叠加的原因。为了解决这么问题我们可以这样做：首先为td定义样式：border:#cc0000solid;border-width:0110,这样表格表现为：然后再为table定义样式:border:#cc0000solid;border-width:1001,这样就可做

作成一个完整的1px表格了。例二：粗边框的1px表格此表格的内格线为1px而外边框为3px，有了例一的基础做起来就不难了，只要修改border-width值就行了。对table所使用的样式的代码是： border:bluesolid;border-width:3223对td所使用的样式的代码是：border:bluesolid;border-width:0110例三：虚线框表格做法和例一类似，border-style从solid改为dashed。对table所使用的样式的代码是： border:blackdashed;border-width:1001对td所使用的样式的代码是：border:blackdashed;border-width:0110例四：点线边框表格注意点线（dotted）的最小象素为2。对table 所使用的样式的代码是： border:greendotted;border-width:20xx对td所使用的样式的代码是：border:greendotted;border-width:0220例五：双线边框表格注意双线（double）的最小象素为3。对table 所使用的样式的代码是：border:teal4double对td所使用的样式的代码是：border:teal1solid例六：outset外框表格对table所使用的样式的代码是：border:3outset对 td所使用的样式的代码是：border:1solid例七：inset外框表格对table所使用的样式的代码是：border:3inset对 td所使用的样式的代码是：border:1solid例八：ridge外

20个很漂亮的CSS表格

并不是所有的Web 开发者都会对美化表格数据感兴趣，今天我们收集了20 个功能强大，外观漂亮的基于Ajax + CSS 的表格效果，你可以从这些示例中学习怎么使用这些表格提供的排序和过滤的功能来组织表格中的数据。现在让我们来看看这些表格：（点击每个样式前面的链接即可进入下载） #1. Tablecloth Tablecloth 由CSS Globe开发，是一个轻量级的、易于使用的表格，以友好的方式将样式和行为添加到你当前的HTML 表格元素当中。 #2. Ask the CSS Guy Table Ask the CSS Guy Table 演示了怎么样创建一个可以显示数据之间的关系的表格，例如在单击某个单元格时可以同时突出显示最顶端的行和最左边的列。

#3. A CSS styled table version 2 Veerle Duoh为我们介绍了一种如何利用CSS 使表格更有吸引力的方法，并且在实现的过程中充分考虑了表格的可访问性。 #4. Sortable Table Sortable Table ——演示了如何按升序或降序排列以及如何过滤显示表格中的数据。 #5. Row Locking with CSS and JavaScript 演示了如何利用Javascript 和CSS 实现“锁定行”的效果，选中的行会一直显示高亮效果直到用户再次点击才会消失。

#6. Vertical scrolling tables 如果你有大量的数据但是没有足够大的空间来显示它，这会是一个很好的解决办法。通过CSS 固定表格的页眉和页脚，但是内容却可以滚动显示。 #7. Replicating a Tree table 利用HTML 和CSS 建立的树状表格。

table表格标签的属性

table表格标签的属性作者：请叫我二狗哥 table标签目前前端主流推荐HTML、CSS、JS三者分离，实际使用table 标签的CSS样式代码还是采用table的style的属性和值来进行外观样式控制。习惯样式： table { display: table; border-collapse: separate; border-spacing: 2px; border-color: gray; } table的style重要属性： border-spacing：规定表格单元格与单元格、外边框的间距； table-layout：规定表格的布局算法； border-collapse：设置表格的边框是否被合并为一个单一的边框；empty-cells：在 collapsed-borders模型中，该属性无效；在separated-borders模型中，当该属性值为hide时，空的表格单元将没有边框和背景。 table表格编程练习小伙伴，编写代码设置表格相应属性，按照效果图，实现相应效果。效果图：

任务 1、设置第一列的北京颜色为orange，表格边框宽度为1，单元格（不包括插入的小表格内单元格）内间距为5px； 2、将表格第一列的第二行和第三行合并； 3、将表格第一列的第五行和第六行合并； 4、在最后合并的单元格的内嵌套一个两行两列的表格； 5、嵌套表格边框为1px； 6、将整个第四行合并；参考代码：表格属性

姓名	年龄	性别	专业	年级	系别
郑春磊	20	男	软件工程	大一	计算机系
李肃文	21	男	软件工程	大一	计算机系

效果如图：

table 单线条设置大全

运用 CSS 语法美化表格 Table
2010-08-28 10:50:44 来源：西部 e 网作者：浏览次数：284 注：除非特殊声明，本文所举各例插入的表格的 cellspacing、cellpadding、border 值均为 0。
例一：例一：1px 表格
很多人热衷于制作 1px 表格，于是发明了各式各样的方法，用 css 做起来可就灵活的多。如果要制作一个 1x1 的 1px 表格只要简单定义一下边框值就可以了。我们首先用 Dreamweaver 插入一个 1x1 表格，宽度为 50，然后在该表格 table 或者 td 中定义 border:1 solid teal,所做的表格的效果如下：
但是要制作一个非 1x1 的表格（如 2x2）就稍微麻烦些，因为如果直接定义 td 样式 border:1 solid teal ，则显示的效果如下：
你会发现表格外框为 1px，而里面则变成了 2px 了，这是由于叠加的原因。为了解决这么问题我们可以这样做：首先为 td 定义样式：border-width:0 1 1 0,这样表格表现为：
然后再为 table 定义样式:border:#cc0000 solid;border-width:1 0 0 1,这样就可做作成一个完整的 1px 表格了。
例二：例二：粗边框的 1px 表格
此表格的内格线为 1px 而外边框为 3px，有了例一的基础做起来就不难了，只要修改 border-width 值就行了。对 table 所使用的样式的代码是：border:blue solid;border-width:3 2 2 3 对 td 所使用的样式的代码是：border:blue solid;border-width:0 1 1 0

使用Table.ApplyStyle与表样式进行交互

【e800编译】此示例中演示如何以编程方式在Microsoft PowerPoint 2010演示文稿中与表样式互动。此代码段是Office 2010的101项VBA代码示例中的一部分。与其它示例一样，这些将可以直接写入您的代码中。每块示例代码包含约5至50行的代码，分别演示了一个独特的功能或功能集，在VBA 或VB以及C＃中（在Visual Studio 2010中创建）。每个示例之中都会包含代码以及相应注释，这样您就可以直接运行获取预期的结果，或者是根据代码注释提示来调整环境，运行示例代码。 Microsoft Office 2010提供了你所需要的工具来创建功能强大的应用程序。Microsoft Visual Basic Application（VBA）代码示例可以帮助你创建自己的应用程序，以执行特定功能或者以此为出发点实现更为复杂的功能。实例代码将此代码复制到演示文稿中中一个模块。并列放置VBA窗口与PowerPoint窗口，按F8（然后按住Shift+ F8）单步执行。 Sub TableStyleDemo() ' Create a new slide with a simple table: Dim sld As Slide Set sld=ActivePresentation.Slides.Add(2,ppLayoutTable) sld.Select Dim tbl As Table Set tbl=sld.Shapes.AddTable(4,4).Table FillTabletbl ' In order to apply a style to a table, you must know the ' StyleID associated with the style. This information is not documented ' nor is there any way to retrieve this information for all the styles. ' This sample includes a list of all the table styles for PowerPoint 2010 ' at the end of the sample. These values are not guaranteed to work in ' any other version of PowerPoint. With tbl.Cell(3,3).Shape.TextFrame.TextRange

HTML5+CSS3 表格设计(Table)

CSS样式： [css]view plaincopy 1.

Company	Contact	Country
Apple	Steven Jobs	USA
Baidu	Li YanHong	China
Google	Larry Page	USA
Lenovo	Liu Chuanzhi	China
Microsoft	Bill Gates	USA
Nokia	Stephen Elop	Finland