更改输入类型提交的字体系列

Question

我需要更改用于提交表单的输入字段的字体系列。 HTML 标记是从联系表单 7 生成的，并且使用

::placeholder

伪类，我能够更改其他表单字段内的字体系列和占位符的颜色。目前我有这个标记

<input class="wpcf7-form-control wpcf7-submit has-spinner" id="submit-button" type="submit" value="Send request">

我尝试使用 CSS 来应用我需要的字体系列，但它被忽略了

#submit-button {
    font-family: "Maiden Orange", serif;
    font-weight: 400;
    font-style: normal;
    background-color: transparent;
    font-size: 26px;
    text-transform: uppercase;
    color: white;
    border: none;
    background-image: url('...');
    background-position: center;
    background-repeat: no-repeat;
}
#submit-button::hover {
    border: none;
    background-color: transaprent;
}

还有其他我可以应用的解决方案吗？

Answer 1

从这里开始，从那里开始工作。

@import url('https://fonts.googleapis.com/css2?family=Maiden+Orange&display=swap');

#submit-button {
  font-family: 'Maiden Orange', serif;
  font-size: 2em;
  padding: 0.25em 0.5em 0;
  border: 2px solid darkorange;
  border-radius: 0.25em;
  background: orange;
  color: white;
}

<input type="submit" id="submit-button" value="Submit"/>