Question

我已经完成了我的网站并完成了样式表，但现在我已经创建了第二个样式表（称为other.css）。我要做的是在我的主页上有2个链接，一个带有“normal.css”，另一个带有“other.css”。所以基本上我希望用户能够在我的2种风格之间进行选择。我复制了所有原始页面并在其名称中添加了“2”，我还创建了other.css并在这些页面上引用了它。 “2”页面都显示替代布局很好，但我不知道如何让用户在样式之间切换...有什么帮助吗？

N.B。我的HTML没有改变，我只是改变了css文件。

戴夫

Answer 1

好问题。答案很大程度上取决于您使用的服务器端技术。例如，使用我经常使用的Google App Engine，只需将生成的HTML标题的一部分更改为指向不同的CSS文件即可。但那时它不是一个静态的HTML文件。

CSS Zen Garden是一个网站，用于说明使用不同样式表呈现的相同HTML文件。也许你可以从那里得到一些如何做到这一点的想法。尽管具有不同样式的页面（即使它们具有相同的HTML源代码）不是静态的.html页面，但您会再次看到。

Answer 2

This W3C page不仅解释了如何操作，而且还有许多备用样式表本身，因此您可以实际测试它。

在大多数浏览器中，用户可以使用View→Page Style切换样式表。所有必要的是菜单栏可见......

Answer 3

如果您的服务器上有php，则可以根据cookie更改样式表。以下代码可以使用：

if ($_COOKIE['style'] == '1') {
echo '<link rel="stylesheet" href="normal.css" type="text/css" />';
}
elseif ($_COOKIE['style'] == '2') {
echo '<link rel="stylesheet" href="other.css" type="text/css" />';
}
else {
echo '<link rel="stylesheet" href="normal.css" type="text/css" />';
}

添加指向页面底部的链接：改变风格

在changestyle.php页面上有以下内容：

if ((isset($_COOKIE['style'])) AND ($_COOKIE['style'] == '1')) {
setcookie(style,2) 
}
elseif ((isset($_COOKIE['style'])) AND ($_COOKIE['style'] == '2')) {
setcookie(style,1) 
}
else {
setcookie(style,2) 
}

在我的网站html上使用2个样式表

3 个答案: