网页设计之5种简单的XHTML网页表单

2019-01-14 12:13:48王旭

#expamle1 label {margin-bottom: 10px;}
#expamle1 input[type="radio"],#expamle1 input[type="checkbox"] {display: inline;}
技术2:懒人
许多开发者采用了这种不正统但是快速简单(用换行隔断标记)的方法。虽然能运行,但是对你的 css 能力有害,因为你不需要任何 css 去实现它。
主要好处:快速
代码:
<form> <fieldset> <legend>Contact Form</legend> <label for="name">Name</label> <input id="name" name="name" size="20" /> <label for="email">Email</label> <input id="email" name="email" size="20" /> <label for=" Choices"> Choices (radio)</label> <input name=" Choice" type="radio" /> Choice 1 <input name=" Choice" type="radio" /> Choice 2 <input name=" Choice" type="radio" /> Choice 3 <label for=" Choices3"> Choices (checkbox)</label> <input name=" Choice3" type="checkbox" /> Choice 1 <input name=" Choice3" type="checkbox" /> Choice 2 <input name=" Choice3" type="checkbox" /> Choice 3 <label for="dropdown">Question</label> <select id="dropdown"> <optgroup label="Group of Options"></optgroup> <option>Option 1</option> <option>Option 2</option> <option>Option 3</option> </select> <label for="message">Message</label> <textarea cols="36" rows="12" name="message"></textarea> <input type="submit" value="send it" /> </fieldset> </form>
运行结果: 上一页12 下一页 阅读全文