如何設置一個文本框（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）的風格

回答

相關問題