submit_button() 是一个核心管理实用功能。它是构成 WordPress 管理主题的众多元素之一,它应该没有样式,因此当 WP 核心开发人员决定更改管理主题时,它会优雅地改变。
但是,如果您真的想为该特定按钮设置样式,我的建议是:为您的按钮添加一个自定义属性,称为 data-style:
<?php
$attributes = array( 'data-style' => 'custom' );
submit_button ( 'Update Profile', 'primary', 'submit', true, $attributes );
?>
而且,在您的 CSS 中,您现在可以使用以下方式设置按钮样式:
[data-style="custom"] {
/* style your button here */
}
更新:Trix's answer 让我仔细查看了function referrence 并意识到 ($type) 可以安全地用于将自定义类添加到任何 WP 管理按钮。很简单:
submit_button ( 'Update Profile', 'custom-class' );
请注意(根据函数参考)您的按钮仍将具有默认的button 类。这应该有效:
.button.custom-class {
/* styles here */
}
更新 2:
我做了更多的测试,显然,该功能如宣传的那样工作。
的实际输出
submit_button(__('Update Stuff'), "custom-class");
曾经:
<p class="submit">
<input type="submit"
name="submit"
id="submit"
class="button custom-class"
value="Update Stuff">
</p>
适用于 WP 管理区域中按钮的大多数规则都以.wp-core-ui 为前缀。 在这种情况下,它们来自.wp-core-ui .button 或.wp-core-ui .button:hover。所以以下选择器应该可以工作:
.wp-core-ui .button.custom-class {
/* normal state rules here */
}
.wp-core-ui .button.custom-class:hover {
/* hover state rules here */
}
.wp-core-ui .button.custom-class:focus,
.wp-core-ui .button-custom-class:active {
/* active/focus state rules here */
}
例如,将这个添加到仪表板 CSS 会改变我的按钮的外观,而不会影响其他按钮:
.wp-core-ui .button.custom-class {
background-color: #272727;
border-color: #666;
color: #ddd;
}
.wp-core-ui .button.custom-class:hover {
background: #212121;
border-color: #666;
color: white;
}
使它看起来像这样:
请注意,.custom-class 规则将被使用 .wp-core-ui .button(WP 管理中按钮的默认选择器)设置的任何规则覆盖。