使用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输入表单？

回答

相关问题