复选标记“\2714”不起作用？答案

【问题标题】：Check mark "\2714" not working?复选标记“\2714”不起作用？
【发布时间】：2013-09-29 19:12:51
【问题描述】：

我正在自定义一个复选框，它似乎正在运行，但 unicode 检查不起作用...它显示为文本“\2714”。
这是我的代码：

.edd_price_option_1762 {
    -webkit-appearance: none;
    background-color: #fafafa;
    border: 3px solid #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
    padding: 9px;
    border-radius: 0px;
    display: inline-block;
    position: relative;
    top: 8px;
}
.edd_price_option_1762:active, .edd_price_option_1762:checked:active {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1);
}
.edd_price_option_1762:checked {
    background-color: #e9ecee;
    border: 3px solid #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
    color: #99a1a7;
}
.edd_price_option_1762:checked:after {
    content:"\2714";
    font-size: 19px;
    position: absolute;
    top: 0px;
    left: 3px;
    color: #49a6db;
}

【问题讨论】：

标签： html css unicode checkbox

【解决方案1】：

您的标记中缺少反斜杠 \。

应该是content: "\2714"; 现在是：content: "2714";

jsFiddle demo - 您发布的代码是正确的 - 它只是与页面上正在实施的不匹配。

【讨论】：

我的 CSS 表有斜线内容："\2714";
为什么说没有？
@AmandaMadelineSzabo 它显然不在其中，否则它不会显示“2714”。
@JoshC 除非它被服务器端脚本最小化错误。
@BramVanroy 是的，你是对的。我不知道如何解决这个问题。

【解决方案2】：

开发工具表明您的 css 是：

.edd_price_option_1762:checked:after {
    content: "2714 ";
    font-size: 19px;
    position: absolute;
    top: 0px;
    left: 3px;
    color: #49a6db;
}

改成（加斜线）：

.edd_price_option_1762:checked:after {
    content: "\2714";
    font-size: 19px;
    position: absolute;
    top: 0px;
    left: 3px;
    color: #49a6db;
}

见附件截图：

【讨论】：

去掉反斜杠没有做任何事情，仍然没有工作
哦，为什么会这样显示？我的 CSS 表清楚地写着 content: "\2714";
@AmandaMadelineSzabo 不，它没有。您确定服务器没有使用缓存版本吗？或者缩小器错误地缩小了文件！但是服务器上的文件没有斜杠。

【解决方案3】：

我不知道这是否会有所帮助。但是正在试验所以认为你应该看到这个：

fiddle

使用javascript

document.getElementById('test').innerHTML = "&#x2714;"

看看有没有帮助。我在某处读到使用 HTML 实体 :) 就像是 ✔

【讨论】：

这确实为我创建了一个有效的检查，但我不知道如何将它集成到我使用复选框的类中。它是我下载的一个插件，所以我不知道如何访问插件的 html 以将样式归因于复选框类....我不知道这是否有意义。但也许这个插件的某些东西导致了问题。
如果插件不允许您尝试执行 setTimeout setTimeout(function(){document.getElementById('test').innerHTML = "&#x2714;"}, 500) 如果您可以访问 javascript :) css 解决方案。让我来
是的，是的 .. :) <script> function foo(){document.getElementById('test').innerHTML = "&#x2714;"}</script> 在需要时调用 foo 。喜欢点击等<button onclick="foo()">
没关系，我找到了另一种打勾的方法。不过谢谢！！

【解决方案4】：

您是否尝试过使用单引号？不知道它是否会有所帮助，但在我的 css 中我使用的是 content: ' \2714';并且复选标记显示正常，除了在

【讨论】：