我正在联系表格。现在显然我希望消息框比电子邮件和主题输入框更大。显然我不能只在css中输入我的输入,因为它会改变所有的方框。我认为指定消息框会是这样的
input [type="text" name="message"] {
padding-bottom: 500px;
}
这显然不起作用......那么我做错了什么?
HTML
<div id="contactContent">
<form>
<label>Email:</label><input type="text" name="email" />
<br>
<label>Subject:</label><input type="text" name="subject" />
<br>
<label>Message:</label><input type="text" name="message" />
</form>
</div>
CSS
#contactContent {
margin-top: 50px;
margin-left: 350px;
}
input {
border: none;
background-color: #CCCCCC;
margin-left: 20px;
margin-bottom: 5px;
padding-right: 250px;
padding-top: 13px;
padding-bottom: 13px;
}
label {
display:inline-block;
width:100px;
font-family:maven;
color: #FF6464;
font-size: 20px;
text-align: right;
}
input [type="text" name="message"] {
padding-bottom: 500px;
}
答案 0 :(得分:5)
您的选择器不正确,通过其类型和名称将样式应用于元素的正确方法是:
input[type="text"][name="message"] {
padding-bottom: 500px;
}
虽然你最好使用类或id来定位元素,除非你有充分的理由这样做。
答案 1 :(得分:2)
消息框的更好选项是<textarea>
元素:
<label for="message">Message:</label>
<textarea id="message" name="message"></textarea>
然后样式不会与输入样式竞争。
无论如何,如果由于某种原因你只想要一行输入,另一个样式钩子将是一个唯一的类或id。