Question

这可能是我所遗漏的令人难以置信的简单，但由于某些原因，我的HTML按钮文本默认为蓝色，尽管CSS中的文本修饰设置为无。

HTML显示为 -

＆＃13;

	.BecomeMemberBtn
    {
    display: block;
    width: 100%;
    height: 40px;
    background: #34b629;
    padding: 10px;
    text-align: center;
    border-radius: 4px;
    font-weight: bold;
    text-decoration:none !important;
    font-size:11px;
    color:  #FFF;
    webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border: solid 1px #20538D;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    }

＆＃13;

<p><a class="BecomeMemberBtn" href=".../become-a-member">Become A New Member</a></p>

＆＃13;

当我在这里运行代码时，它会以白色显示，但是当我在移动设备（Android和iPhone）上测试它时，它会以默认蓝色显示，这使得它在绿色背景下无法读取那个按钮。

让我更烦恼的是，我有另一个按钮，它使用或多或少完全相同的代码并且显示正确 -

＆＃13;

  .MobSampleBtn
    {
    display: block;
    width: 100%;
    height: 40px;
    background: #1e558d;
    padding: 10px;
    text-align: center;
    border-radius: 4px;
    color:  #FFF;
    font-weight: bold;
    text-decoration:none; 
    font-size:10px;
    webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border: solid 1px #20538D;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    }

＆＃13;

<p><a class="MobSampleBtn" href=".../Sample/True">Download Free Sample</a></p>

＆＃13;

我的问题是 - 为什么在移动设备上，BecomeMemberBtn默认为蓝色文字，但MobileSampleBtn会按预期更改为白色？

Answer 1

由于常规状态在代码中的定义方式相同，因此差异可能来自:visited状态的样式。因此，请确保您还添加样式：

＆＃13;

.BecomeMemberBtn:visited,
.MobSampleBtn:visited {
    color: #fff;
}

＆＃13;

Answer 2

CSS text-decoration属性仅引用underline。您想要（重新）将其设置为color属性。

如果您正在使用外部CSS文件，请务必清理缓存。

HTML链接在移动设备上默认为蓝色

2 个答案: