css - CSS在同一页面中具有不同ID的多个表
问题描述
我们在同一页面中有两个不同的表。用于其他目的所需的不同 ID。所以我们在 Style 中创建了多个 CSS 表格元素。但只有第一个有效。如果我将客户设计放在首位,它将被应用,但一次只能应用一个。
#salescss {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#salescss td, #salescss th {
border: 1px solid #ddd;
padding: 8px;
}
#salescss tr:nth-child(even){background-color: #f2f2f2;}
#salescss tr:hover {background-color: #ddd;}
#salescss th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #357EC7;
color: white;
body {font-family: Arial;}
#customers {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#customers td, #customers th {
border: 1px solid #ddd;
padding: 8px;
}
#customers tr:nth-child(even){background-color: #f2f2f2;}
#customers tr:hover {background-color: #ddd;}
#customers th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #357EC7;
color: white;
body {font-family: Arial;}
解决方案
你有一个失踪}
后#salescss th {
和#customers th {
#salescss {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#salescss td, #salescss th {
border: 1px solid #ddd;
padding: 8px;
}
#salescss tr:nth-child(even){background-color: #f2f2f2;}
#salescss tr:hover {background-color: #ddd;}
#salescss th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #357EC7;
color: white;
}
body {font-family: Arial;}
#customers {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#customers td, #customers th {
border: 1px solid #ddd;
padding: 8px;
}
#customers tr:nth-child(even){background-color: #f2f2f2;}
#customers tr:hover {background-color: #ddd;}
#customers th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #357EC7;
color: white;
}
body {font-family: Arial;}
推荐阅读
- vuejs2 - Vue 应用程序中的 AWS Amplify GraphQL API 返回 Null
- vba - 如何自动保存来自特定发件人的附件?
- node.js - 如果 api 没有响应,防止请求等待超过 10 秒
- java - 如何使用没有加密的 Bouncycastle 将 GPG 盔甲转换为 ASCII?
- python - 如何使用多种条件点击按钮
- scripting - 鱼不会从带有“return”的函数返回指定的状态代码
- python - 制作具有多索引值的字典
- visual-studio-code - VSCode:键入时禁用 linting
- css - Css3 Flexbox 3列布局小宽度,拉伸中间一和宽度:右边最大200px
- android - 在 iOS 中反应原生渲染图像边框半径