无法使用 CSS 格式化 html 表单元素（标签和输入）答案

【问题标题】：Can't format html form elements (label and input) using CSS无法使用 CSS 格式化 html 表单元素（标签和输入）
【发布时间】：2015-12-03 13:16:48
【问题描述】：

我在使用 CSS 编辑按钮时遇到问题。不管我做什么，我能改变的只是字体的颜色（我只试过颜色和字体粗细）。我不能使用 css 操作 html 元素有什么原因吗？

#login-frame {
	color: #900;
}

#login-text {
	font-weight: bold;
}

<td>
	<label id="login-frame" for="login-text">
	  <input value="Log In" tabindex="4" id="login-text" type="submit">
	</label>
</td>

【问题讨论】：

你想做什么？
可能重复 - stackoverflow.com/questions/21664610/…
也许下面的一些 css 会改写你的风格。尝试在属性定义后添加!important：#login-text { color: red !important; }
您要更改按钮的字体颜色吗？如果是，那么像这样使用#login-text input{color:red;}
对我来说似乎没问题.. 能够改变很多事情：jsfiddle.net/3gfrxnLt

标签： html css

【解决方案1】：

您需要设置appearance: none，并带有相关的供应商前缀。

#login-frame {
	color: #900;
}

#login-text {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;

	font-weight: bold;
}

<td>
	<label id="login-frame" for="login-text">
	  <input value="Log In" tabindex="4" id="login-text" type="submit">
	</label>
</td>

【讨论】：

【解决方案2】：

你在错误的类中给出了颜色代码

 #login-frame 
 {
    color:/* #900;*/
 }

加入这个类

 #login-text 
 {
     color: #990000;
     font-weight: bold;
 }

【讨论】：

【解决方案3】：

你做错了什么：

您正在将颜色应用于父母而不是您可以使用的孩子

登录文本{颜色}
登录框输入{color....}
登录框架#login-text{color....}

注意：您必须了解 css 的工作原理

如果您必须将样式从父级应用到子级，则使用 parent[space]child

如果您想直接将样式应用于子元素，则使用该元素的类或 id

示例 1：#login-text{color}

#login-text {
	font-weight: bold;
    color: #900;
}

<td>
	<label id="login-frame" for="login-text">
	  <input value="Log In" tabindex="4" id="login-text" type="submit">
	</label>
</td>

示例 2：#login-frame input{color....} 在示例 2 中您也可以使用

登录框输入#login-text

#login-frame input{
	color: #900;
}

#login-text {
	font-weight: bold;
}

<td>
	<label id="login-frame" for="login-text">
	  <input value="Log In" tabindex="4" id="login-text" type="submit">
	</label>
</td>

示例 3：#login-frame #login-text{color....}

#login-frame #login-text{
	color: #900;
}

#login-text {
	font-weight: bold;
}

<td>
	<label id="login-frame" for="login-text">
	  <input value="Log In" tabindex="4" id="login-text" type="submit">
	</label>
</td>

【讨论】：

登录文本{颜色}

登录框输入{color....}

登录框架#login-text{color....}

登录框输入#login-text