如何设置一个文本框（HTML）的风格

我想改变这只是宽度：如何设置一个文本框（HTML）的风格

 <input type="text" name="experience"/>

但我有这样的：

<input type="checkbox" name="option2" value="2222" />

改变过。当我设置：

input {width:134px;}

来源

2011-10-03 Dmitry Makovetskiyd

您没有“文本框”。认真。我意识到这可能只是让我感到沮丧，但你有*是一个文本输入。你甚至可能有一个'textarea'。但是你真的*没有'文本框'。叹息... –

给它一个class或id并使用class和id选择：

<input type="text" name="experience" id="experience" /> 
<input type="text" name="experience" class="experience" /> 

#experience { width:134px } 
.experience { width:134px }

或者，你可以使用一个attribute selector：

input[name='experience'] { width:134px }

然而要注意的属性选择器不工作在IE6，所以如果你想支持，你必须去同一个class和id选择。

来源

2011-10-03 12:39:06

该死的，我有很多文本框...我必须做很多工作然后 –

只有IE6很重要。如果不是，只需使用属性选择器即可。 –

-1

您的原始问题提到了单个文本输入，但您的后续评论提到您有很多文本输入，为了避免在您的css文件中重复，可以将输入类设置为“short”，然后应用该类的宽度。

input.short {width : 134px}

如果你想宽度适用于输入特定的形式（或要素），你可以使用：

form input {width : 134px}

，如果你需要改变的宽度，这可能是未来扩展性更强所有文本输入的表格/网站

来源

2011-10-03 12:40:34

这将选择具有“输入”的子类的“short”类的元素，而不是具有“短”类的输入元素。 –

詹姆斯是对的，你的声明应该是“intput.short”而不是“input [space] .short” –

感谢Mathieu，实际上詹姆斯并不完全正确，因为输入元素不应该有子元素， m知道，但是这是我的错误，现在我改变了它 - 谢谢 –

如果您希望仅应用于特定文本框，请使用the style attribute。

<input type="text" name="experience" style="width:134px"/>

如果你想它适用于网页上的所有文本框，使用CSS：

.textbox { 
width:134px; 
}

，然后它适用于文本：

<input type="text" name="experience" class="textbox"/>

来源

2011-10-03 12:40:59 Saket

如果你想成为移动兼容，你不应该使用内联样式，总是使用ID选择器或类选择器。这就是集成商在工作中告诉我的。 –

是的，这是真的，因此给了我的答案类替代:) – Saket

不改变HTML ，您可以使用name属性设置css：

input[name="experience"]{ 
    width:134px; 
}

来源

2011-10-03 12:41:01

你应该给输入框类/ ID，例如：

那么你应该设置样式参数在你的CSS样式表：为了设置类styliing使用。名称{ ...}，id使用#name {...}

来源

2011-10-03 12:43:17

你有'id'和'类'选择错误的方式。 'id'选择器使用'#'和''''选择器使用'.' –

您可以按类型设置样式。

<input type="text" name="email"> 
<input type="text" name="phone"> 

input[type="text"]{ background:#ff0000; }

来源

2011-10-03 12:49:51

如何设置一个文本框（HTML）的风格

回答

相关问题