表单项

概论:在博客园里看见很多大神一般的人物,我呢,现在属于园中微不足道的一人,发的博客经常没过多久就多半因篇幅或深度不够被移出首页(有点难过),但我不会因此而放弃的,我会努力增强自己技能,一步一个脚印,打好坚实的基础,走上自己想走的一条道路,也希望看到这篇随笔的人加油哦~不抛弃,不放弃!

以下是个人对表单元素的代码罗列以及经验总结:

<!-- 单行文本框,密码文本框 -->
<p>用户名:<input type="text" name="user" value=""></p>
<p>&nbsp;&nbsp;&nbsp;码:<input type="password" name="psw" value=""></p>

<!-- 单选按钮 checked="checked"预设,代码里代表性别女已被预选 注意两个name值要一样,否则达不到单选的效果-->
<p>
性别:
<input type="radio" name="sex" value="男">&nbsp;<input type="radio" name="sex" value="女" checked="checked">
</p>
<!-- 复选框,如若要提前选中,要加上checked="checked",预设已选中 --> <p>
爱好: 羽毛球 <input type="checkbox" name="hobby" value="羽毛球">&nbsp;&nbsp;&nbsp;<input type="checkbox" name="hobby" value="网&nbsp;&nbsp;球" checked="checked">&nbsp; 乒乓球 <input type="checkbox" name="hobby" value="乒乓球">&nbsp;&nbsp;&nbsp;<input type="checkbox" name="hobby" value="瑜&nbsp;&nbsp;珈">
</
p> <!-- 下拉列表,multiple="multiple"表示下拉列表中的选项可多选,(<select>...</select>)(<option>...</option>)是双标签 --> <p>课程: <select name="select" multiple="multiple" > <option value="01">计算机基础</option> <option value="02">计算机网络</option> <option value="03">计算机组成原理</option> <option value="04">计算机导论</option> <option value="05">计算机科学与技术</option> </select>
</
p> <!-- 上传文件 --> <p>上传照片:<input type="file" name="f"/></p>

<!-- 多行文本框,一个汉字占两个字节占两列,一个字母占一列 ,当输入文字超过显示容量时,多行文本框会自动加上滚动条-->
<p><textarea rows="4" cols="6">真善美,是我们每一个人穷尽一生努力追求的 zhenshanmeishiwomenmeiyigerenqiongjinyishengnulizhuiqiude</textarea></p>
<p> 
<input type="button" name="b" value="单击进入" onclick="alert('你单击了按钮')">&nbsp;
<!--普通按钮,onclick触发按钮事件,单击后有对话框提示-->
<input type="submit" name="s" value="提交">&nbsp;
<input type="reset" name="r" value="重置">&nbsp;
<input type="image"src="images/submit.gif" alt="提交" title="点击提交">
<!--使用图片提交,建议alt(当图片加载不出来或者图片路径不正确情况下会显示alt的值用来表示图片的内容)和title(当鼠标放置图片上时显示title的值)都使用-->
</p>

 

posted @ 2016-06-20 15:40  雅宁  阅读(577)  评论(0编辑  收藏  举报