Question

我遇到一个问题，即页面上的textarea元素在前端渲染时正在应用某些内联样式-但是样式不在我的HTML中，因此我尝试使用！important覆盖它在我的造型中。

我在这里找到了一个存在类似问题的人：similar issue-但没有人能够解决这个问题。

因此，我的文本区域HTML如下：

<textarea class="contact-field focus-hide" id="message" name="message" required autocomplete="off"></textarea>

我的CSS如下：

.contact-field {
background-color: #FFFFFF;
border: none;
padding: 10px 10px;
font-size: 16px;
color: #000000;
outline: none;
display: block;
margin-bottom: 10px;
width: 100%;
transition: all 300ms ease-in-out;
box-sizing: border-box;

}

.contact-field:focus {
    background-color: rgba(0,0,0,0.5) !important;
    color: #FFFFFF;
}

但是，当页面呈现某些内联样式时，它神秘地出现了，这打破了我CSS的：focus更改：

<textarea class="contact-field focus-hide" id="message" name="message" required="" autocomplete="off" data-gramm="true" data-txt_gramm_id="c66481f6-0696-cdf9-ee03-18973388ba4a" data-gramm_id="c66481f6-0696-cdf9-ee03-18973388ba4a" spellcheck="false" data-gramm_editor="true" style="z-index: auto; position: relative; line-height: normal; font-size: 16px; transition: none 0s ease 0s; background: transparent !important;"></textarea>

哦，还有一件事，这不是在本地计算机上发生的-仅当我将其上传到Web服务器时才发生。服务器上是否可能有什么引起此问题？！

希望有人能够为我解决这个问题？太令人沮丧了！

谢谢

内联样式神秘地应用于前端的文本区域

0 个答案: