在css中，如何去除input标签的默认样式？

Posted 2023-04-17

input-webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none;

去除input的默认样式用上边的代码就可以实现了。

如果是只去除部分input的默认样式您可以使用class或ID来指定。

参考技术A

取消input的默认样式

input-webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none;

参考技术B 默认输入框聚焦样式去除方法: input:focus outline:none
如果要完全重写可以在css中写 例如
input border:2px solid #e36514 ; width:245px ; height: 25px; 参考技术C 比如说，input的class为textinput，则CSS的条目写为input .textinput

如何定义input标签中 type="text"的CSS样式

可以用css3中新增的选择器“[attribute=value]”来同时选中指定的属性的标签。

1、新建html文档，添加5个input标签，其中第一个和最后一个“type”属性的属性值为“text”：

2、在head标签和body标签之间添加style标签，添加代码“input[type=text]”，“input”指的是标签名，“type”指的是属性名，“text”指的是属性值，这个就会把所有属性名为“type”、属性值为“text”的input标签选中：

3、为被选择的标签设置背景色为红色，这时属性值为“text”的第一个标签和最后一个标签背景色都变成了红色：

参考技术A 第一种：
.style1color:red;
.style2color:green;
<input type="text" class="style1" />
<input type="password" class="style2" />

第二种：
<input type="text" style="color:red;" />
<input type="password" style="color:green;" />
第三种：css3选择器，ie低版本不支持
input[type=text]color:red;
input[type=password]color:green;

<input type="text" />
<input type="password" />
当然还可以根据js去做本回答被提问者和网友采纳