个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我有一个 HTML 文件可以静态显示我学校的日程安排。如何让表格行根据时间全天更改背景颜色？我希望类主任行仅在类主任期间具有不同的背景颜色，然后在第一节课的行具有不同背景颜色时恢复正常。以此类推。
<!DOCTYPE html>
<html>
<head>
<title>Schedule 1</title>
<style>
body {
background-color: black;
color:white;
text-align: center;
}
table, th, td {
color: black;
background-color: white;
text-align: center;
border: 2px solid black;
border-collapse: collapse;
font-size: 25px;
margin: auto;
padding: 5px;
}
th {
width: 300px;
height: 40px;
}
td:nth-child(1) {
width: 80px;
}
td:nth-child(2) {
width: 160px;
}
.table {
height: 500px;
}
</style>
</head>
<br><br>
<h1 style="color:white; bgcolor:black">SCHEDULE 1</h1>
<div class="table">
<table class="schedule">
<tr> <th width="300" colspan="2">REGULAR</th> </tr>
<tr> <td>HR</td><td>8:04 - 8:17</td> </tr>
<tr> <td>1</td><td>8:21 - 9:06</td> </tr>
<tr> <td>2</td><td>9:10 - 9:55</td> </tr>
<tr> <td>3</td><td>9:59 - 10:44</td> </tr>
<tr> <td>4</td><td>10:48 - 11:33</td> </tr>
<tr> <td>5</td><td>11:37 - 12:22</td> </tr>
<tr> <td>6</td><td>12:26 - 1:11</td> </tr>
<tr> <td>7</td><td>1:15 - 2:01</td> </tr>
<tr> <td>8</td><td>2:05 - 2:50</td> </tr>
</table>
</div>
</body>
</html>
最佳答案
您可以做类似的事情，这使用 jQuery。在你的 javascript 中，找出是白天还是晚上(如果你愿意，你可以检查更多次)然后根据结果更新你的 dom 样式。 (这是 24 小时格式，您可以将其更改为 12 小时格式以使您的 if/else 语句更容易，如下所示:((hourCompare + 11) % 12 + 1)
var d = new Date();
var hourCompare = d.getHours();
if (hourCompare >= 8 && hourCompare <= 22) {
//day time
$('.tableCell').css("background-color", "yellow");
} else {
//night time
$('.tableCell').css("background-color", "blue");
}
我为您整理了一个 jsfiddle。为了获得正确的颜色，您基本上必须为您想要查找和更新颜色的每个小时编写一个 if 语句，就像我在 fiddle 中所做的那样。我编写它是为了使用 setInterval 每 3 秒检查一次时间更新。 https://jsfiddle.net/zu588wjr/1/
关于javascript - 根据时间 0f Day 更改全天哪个表行背景颜色变化，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43215617/
24
4
0
我想要一些如何打印消息，例如:“从那时起，已经过去了 x 天、y 小时、z 分钟和 w 秒”。目前我正在做这样的事情，但我想念剩下的部分(最重要的是)我不喜欢它。应该有更美的东西 dt = (date
有一个令人费解的要求。 基本上我需要根据这些条件创建唯一的 id 9 位数字，当天唯一(表示如果第二天再次出现该号码也没关系) 实时生成；仅限 java(意味着没有从数据库生成序列号 - 实际上根本没
我是一名优秀的程序员,十分优秀！