使用 CSS 更改按钮颜色

Question

我有这个 html，它使用了一些 Javascript。 我正在尝试使用 CSS 更改按钮的颜色。 CSS 位于名为 getreplies.css 的文件中，其中包含

 .button { color: red; }

 <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="getreplies.css"> </head> <input class="button" type="button" onclick="location.href='path/messages.pl?name=<TMPL_VAR NAME=name>&page=<TMPL_VAR NAME=page>';" value="<TMPL_VAR NAME=page>"> </html>

但它不起作用。 我没有看到任何变化。 另外，有人可以告诉我如何使用 CSS 将这些按钮居中吗？ 谢谢你的帮助！

PS 如果有帮助，那么我将在 perl cgi 脚本中执行此操作。

Answer 1

您在问题中提供的代码是独立运行的。

在浏览器中打开开发人员工具。 查看网络标签。 查看对getreplies.css请求的响应。

您可能会看到500 Internal Server Error。

（由于您尚未进行此调试，因此我将假定是这种情况，因为这是您所看到的内容的最可能的解释）

如果有帮助，那么我将在perl cgi脚本中执行此操作

CGI的典型配置是指定目录（通常为/cgi-bin/ ）包含CGI脚本，并且仅包含CGI脚本。

由于getreplies.css是相对URI，因此，如果您的脚本是/cgi-bin/example.cgi则样式表将是/cgi-bin/getreplies.css并且您的Web服务器将尝试将其作为CGI脚本执行。

由于它不是可执行文件，因此失败。

将样式表移出cgi-bin 。

Answer 2

你可以试试这个代码：

 function setColor(e) { var target = e.target, status = e.target.classList.contains('active'); e.target.classList.add(status ? 'inactive' : 'active'); e.target.classList.remove(status ? 'active' : 'inactive'); }

 .active { background-color: #7FFF00; } .inactive { background-color: #FFFFFF; }

 <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="getreplies.css"> </head> <input type="button" id="button" value="button" style="color:blue" onclick="setColor(event)"; data-count="1" /> </html>

Answer 3

看起来您的CSS中的按钮拼写错误。

.buton{
color: red;}

应该。

.button{
color: red;}

李

Answer 4

要为按钮设置样式，应使用input[type=button] {color: red; } input[type=button] {color: red; }

或将类名.button更改为其他名称.mybutton

希望这个帮助

Answer 5

.button{background-color:red;margin:0 auto;}

并把

 text-align:center;

在包含元素上

另外，您可能需要清除缓存或在网址中添加？v = 0.001，例如

  <link rel="stylesheet" href="getreplies.css?v=0.0001">

看到你的国防部每次刷新

Answer 6

您需要使用background-color而不是color ，例如：

.button{
    background-color: red;
}

使用 CSS 更改按钮颜色

问题描述

6 个解决方案

解决方案1
1 2017-10-29 08:01:57

解决方案2
1 2021-08-26 16:23:42

解决方案3
0 2017-10-29 07:15:03

解决方案4
-1 2017-10-29 07:24:04

解决方案5
-1 2017-10-29 07:28:06

解决方案6
-1 2017-10-29 07:37:14

使用 CSS 更改按钮颜色

问题描述

6 个解决方案

解决方案1 1 2017-10-29 08:01:57

解决方案2 1 2021-08-26 16:23:42

解决方案3 0 2017-10-29 07:15:03

解决方案4 -1 2017-10-29 07:24:04

解决方案5 -1 2017-10-29 07:28:06

解决方案6 -1 2017-10-29 07:37:14

解决方案1
1 2017-10-29 08:01:57

解决方案2
1 2021-08-26 16:23:42

解决方案3
0 2017-10-29 07:15:03

解决方案4
-1 2017-10-29 07:24:04

解决方案5
-1 2017-10-29 07:28:06

解决方案6
-1 2017-10-29 07:37:14