使用CSS處理html輸入表單？

因此，目前我正在嘗試編輯html輸入表單的總體佈局和外觀。繼承人我的HTML輸入形式的我的代碼片段：使用CSS處理html輸入表單？

<p> <form action='register.php' method="POST"></p> 
<p>First Name: <input type="text" name="firstName" />Last Name: <input type="text"  name="lastName"/></p> 
<p>Address: <input type="text" name="address" /></p> 
<p>City: <input type="text" name="city" /></p>

這編輯是這樣的CSS：

#Address, #emailAddress, #password, #confirmPassword, #firstName, #lastName{ 
width:50%; 
outline: double 1px #FFA500; 
height:16px; 
padding:10px; 
}

問題是，沒有任何與此代碼更改。這不應該改變我的html輸入形式嗎？

來源

2012-07-12 mike

嘗試在您的html上使用id屬性而不是name屬性。

<input type="text" id="firstName" />

來源

2012-07-12 17:16:22 peacemaker

您需要爲輸入分配一個ID或類。

記住，用CSS;

ID = #object
類= .object

<p>First Name: <input type="text" name="firstName" id="firstName" />

來源

2012-07-12 17:18:22 jzacharia

我知道我錯過了一些東西！非常感謝！ – mike 2012-07-12 17:21:04

另外，正如@Wex提到的那樣，通過爲一個選擇器同時定義所有'輸入'元素的樣式，它將爲您節省時間。看看他發佈的代碼。 – jzacharia 2012-07-12 17:26:04

它要好得多一次定義樣式爲所有input元素：

input { 
    width: 50%; 
    outline: double 1px #FFA500; 
    height: 16px; 
    padding: 10px; }

你應該閱讀CSS selectors。

來源

2012-07-12 17:18:28 Wex

謝謝。這很好，但每個都有自定義參數（它們看起來會有所不同） – mike 2012-07-12 18:13:04

但是，如果要共享樣式，則定義基本樣式是有意義的。正如其他人所說，如果你正在尋找更多的特異性使用'id'或'class'屬性。 – Wex 2012-07-12 18:59:17

這裏有一些快速意見：

元素的不當嵌套。例如，在段落標籤中打開表格標籤。此外，表單標籤未關閉
用「id」屬性，而不是「名」
確保#Address輸入ID（目前，事實並非如此）
城市輸入ID不匹配反映在CSS

來源

2012-07-12 17:23:18 Liggy

使用CSS處理html輸入表單？

回答

相關問題