Struts2文本框样式问题：如何去除文本框背景色？

你遇到的Struts2文本框样式问题，先看下对应的显示效果：
Struts2文本框样式

从你给出的代码和显示效果来看，这个背景色大概率来自Struts2默认主题的自带样式，或者是父元素样式的影响，下面给你几个可行的解决办法：

1. 切换Struts2主题为simple #

Struts2默认使用xhtml主题，这个主题会给表单元素注入一套默认样式（包括背景色、边框等）。如果想完全摆脱默认样式，自己自定义，最简单的方式就是把主题改成simple：

• 单个表单生效：直接在<s:form>标签里添加theme属性

<s:form action="Update_datos_XML" theme="simple">
  <s:hidden id="id" name="id_sesion" value="%{#session.Sesion_usuario.id_sesion}"/>
  <div style="font-family:Arial;color: #af2d2d; background-color: rgba(0,0,0,0.1)">
    <span>
      <s:textfield name="nom_pre" id="nombre" key="Nombre" placeholder="<%= pre.getNom_pre()%>"/>
    </span>
    <!-- 其他表单元素 -->
  </div>
</s:form>

• 全局生效：在struts.xml里配置全局主题，这样所有表单都会应用这个设置

<constant name="struts.ui.theme" value="simple" />

2. 用CSS直接覆盖默认样式 #

如果不想切换主题，只想修改文本框的背景色，可以通过CSS精准覆盖：

方式A：给文本框加自定义类名 #

给<s:textfield>添加cssClass属性，然后写对应的CSS规则：

<s:textfield name="nom_pre" id="nombre" key="Nombre" placeholder="<%= pre.getNom_pre()%>" cssClass="plain-input"/>

对应的CSS：

.plain-input {
  background-color: transparent; /* 透明背景，会显示父元素底色 */
  /* 或者设置为白色：background-color: #ffffff; */
  border: 1px solid #ddd; /* 可选，保留边框避免样式太突兀 */
}

方式B：直接针对Struts2生成的元素 #

Struts2的xhtml主题会给文本框生成class="text"的属性，你可以直接写通用规则：

input[type="text"].text {
  background-color: #ffffff; /* 替换成你想要的颜色 */
}

3. 排查父元素样式影响 #

你代码里的外层<div>设置了background-color: rgba(0,0,0,0.1)，如果文本框本身背景是透明的，就会透出父元素的灰色背景。如果这不是你想要的，给文本框设置明确的背景色就能解决，比如针对你的nombre文本框：

#nombre {
  background-color: #ffffff;
}

你可以根据自己的需求选合适的方法——如果想彻底自定义表单样式，切换simple主题最省心；如果只想调整个别元素的样式，用CSS覆盖更灵活。

内容的提问来源于stack exchange，提问作者Alessia Houston