在特定日期使用CSS更改背景？

Question

有人知道如何在特定日期使用CSS自动更改网站的背景吗？比如情人节、复活节、圣诞节等等。

Answer 1

为此，您必须使用服务器端语言，如PHP或JavaScript。例如，使用PHP，您可以使用date()访问服务器日期/时间，并执行以下操作：

if(date('m/d') == '2/14'))
    'get your girl a present, dude!';

使用服务器端代码的好处是它对用户来说更快。缺点是它是你的服务器的日期和时间，而不是用户的，所以你可以用Javascript做同样的事情，如下所示：

var curtime = new Date(),
    curday = curtime.getDate(),
    curmonth = curtime.getMonth()+1;

if(curmonth == 2 && curday == 14)
   alert('better be quick');

无论哪种方式都行得通。

为了清楚起见，添加了:上面的将允许您检查日期。然后，您可以使用它将CSS类添加到HTML元素中，例如，您已经为当天准备好了。假设你用Javascript做这件事，你会写

$('#wrap').addClass('valentines');

而不是上面的alert()。这会将类valentines添加到<div id="wrap">中--仅作为示例。然后，您可以对该CSS类执行任何您喜欢的操作。

编辑:我在最后一段代码中使用了jQuery。你也可以单独使用Javascript - Loktar已经在他的答案中添加了这一点。

Answer 2

你不能只使用css，但是你可以像这样结合javascript和css，

var checkDate=new Date(),
today = new Date();
checkDate.setFullYear(2011,1,14);

if (today.getTime() === checkDate.getTime()){
    document.getElementById("background").className += 'valentinesBackgroundStyle';
}

http://jsfiddle.net/sH429/

Answer 3

你不能用css做到这一点。您需要使用JavaScript来完成此操作。

例如，要在情人节将背景颜色更改为红色：

var date = new Date();
if(date.getDate() == 14 && date.getMonth() == 1) {
    document.body.style.background = "red";
}