无法在 WordPress 中设置 <a> 标签的样式

Question

我正在连接一个动作并向该函数添加一些 HTML，但我似乎无法像我想要的那样设置 'a' 标签的样式。我正在尝试创建一个可点击的按钮，所以我想我只是将其设为 link 然后使用 CSS 设置样式，但我无法将 CSS 设置为定位标签。

这是HTML：

echo '<a href="www.casthorndesigns.com/wp-login.php?action=register" class="reg_btn">Register/Login</a>';

和CSS：

.reg_btn a{
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   width: 200px;
   height: 45px;
   border: 2px solid #000;
   background-color: #fff;
   text-decoration: none;
   color: #000 !important;
}

.reg_btn a:hover{
   cursor: pointer;
}

默认主题的 'a' 标签是否覆盖了我的代码？我什至出于绝望尝试了 !important，但无法让它工作。任何帮助都会很棒，谢谢。

Answer 1

您应该在 CSS 代码中只使用 class 的名称，如下所示：

.reg_btn {
   -webkit-appearance: button;
   -moz-appearance: button;
   appearance: button;
   width: 200px;
   height: 45px;
   border: 2px solid #000;
   background-color: #fff;
   text-decoration: none;
   color: #000 !important;
}

.reg_btn:hover{
   cursor: pointer;
}

Answer 2

从您的选择器中删除 a。 .reg_btn 已经是相关元素的 class，足以单独使用该选择器作为目标。

Answer 3

您的 CSS 正在针对 class reg_btn 中的锚元素。

将 'a' 移动到选择器的开头或将其完全删除。

a.reg_btn { }

或

.reg_btn { }

无法在 WordPress 中设置 <a> 标签的样式

Can't style <a> tag in WordPress

html

css

wordpress

hook