css - 在 html 表中添加两个类

标签 css class html-table tablesorter

<分区>

查看this文章中,我制作了一个类 (t1),以便表格在移动设备上正确定位。像这样:

/*
Label the data
*/
.t1 td:nth-of-type(1):before { content: "Name"; }
.t1 td:nth-of-type(2):before { content: "Category A"; }
.t1 td:nth-of-type(3):before { content: "Category B"; }
.t1 td:nth-of-type(4):before { content: "Category C"; }

.t2 td:nth-of-type(1):before { content: "Name"; }
.t2 td:nth-of-type(2):before { content: "Category X"; }
.t2 td:nth-of-type(3):before { content: "Category Y"; }
.t2 td:nth-of-type(4):before { content: "Category Z"; }

我还从 this 添加了一个表格排序器网站和分拣机也工作正常。排序器已经有一个类(tablesorter)

当我使用以下内容时,由于 t1 类,表格在移动设备上的位置正确

<table id="table1" class="t1" width="100%" border="1" >

当我使用以下内容时,由于 tablesorter 类,表格正在排序

<table id="table1" class="tablesorter" width="100%" border="1" >

现在我的问题是,我只能在表中使用一个类,以便移动定位正确发生或分类器发生。我希望两者都能发挥作用。是否可以在表中使用两个类?我读了一篇文章here但我认为它不适用于我的问题。谁能提出实现这一目标的方法?

t2 类工作正常,因为我没有在上面放分拣机。

谢谢

编辑:它不是重复的,因为我看到一些为多个类编写的函数 here所以很困惑。然而,我现在得到了解决方案,添加了一条评论“当在移动设备上逐行查看表格时,排序功能不起作用。但它在桌面上工作!有没有办法让它在移动设备上工作? "

最佳答案

是的,你可以。您可以为一个元素定义多个类,方法是用空格分隔它们。

<table id="table1" class="t1 tablesorter" width="100%" border="1" >

来自 MDN Global Attributes Reference :

class
This attribute is a space-separated list of the classes of the element.

关于css - 在 html 表中添加两个类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25996353/

上一篇:html - 强制元素不水平拉伸(stretch)表格单元格

下一篇:css - 在两个 Div 之间添加间隙

相关文章:

python - 在 Python 中给一个类起别名

Jquery 循环遍历表行并获取第 n 个子值

php - 表正在创建 1 行而不是创建 9 行

Javascript 自定义表格列的能力。允许用户删除和添加新列的按钮

javascript - 用鼠标选择文本并突出显示该 div 中多次出现的相同文本

javascript - 使用缩放 css 时边缘浏览器问题

java - ImageButton 在类中不起作用

class - 错误 "Can' t access this in a field initializer 是什么意思”?

twitter-bootstrap - 响应式CSS,当设备高度相同且宽度不同时的两种不同布局

javascript - jQuery 中的样式代码不起作用