我想显示一个带有提交按钮的表单,以将文本字段发回服务器:
- 一个名为
title
的文本输入,带边框 - 名为
chapter
和section
的文本没有边框,它们应该在JavaScript 中分配
我希望章节/部分不可修改且简短。但是 Title 是一个正常的输入,应该非常接近 Title 这个词,比如:
Chapter 3 Section 4
_____________
Title |_____________|
我写的 CSS 像 "input[type="notext"]{border: none}
然后两个文本输入都有边框,或者没有边框。我基本上希望两个输入有不同的style,或者其他类型的chapter/section字段让我设置值也可以。那么如何实现呢?不需要兼容IE8及之前的版本。
input[type="text"]{
border: none;
font-size: 16px;
}
<form action="#" method="post" id="form" >
<table>
<tr>
<td>Chapter<input type="text" value="3" name="cha_n" readonly/></td>
<td>Section <input type="text" value="4" name="sec" readonly/></td>
</tr>
<tr>
<td>Title </td>
<td><input type="text" style="inputtext" name="title" id="title"/></td>
</tr>
<tr>
<td span='2'><a id="submit" href="javascript: check()">Send</a></td>
</tr>
</table>
</form>
最佳答案
您可以为您的输入定义一个 CSS 类并直接使用它们。
对于带有类示例的输入:
input.example {
border: none;
font-size: 16px;
}
像这样使用它:
<input class="example" type="text" value="3" name="cha_n" readonly/>
示例:http://jsfiddle.net/x762v24a/
一种不太通用的方法是使用 CSS 属性选择器:
input[name="cha_n"] {
border: none;
}
关于html - 如何在同一个 html 表单中有不同的输入文本样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25881526/