文本域<textarea>,可以输入多行文本。
HTML文本域几种常用样式:
没有滚动条的文本域(无边框)
<textarea style="border: 0 overflow: auto color: #FFFFFF background-image: url(http://expert.csdn.net/images/csdn.gif)"></textarea>
红色边框的文本域
<textarea style="border: #FF0000 1px solid overflow: visible color: #FFFFFF background-image: url(http://expert.csdn.net/images/csdn.gif)"></textarea>
无边框有滚动条
<textarea style="scrollbar-face-color:#ff80ffborder:0pxbackground-image:url(http://expert.csdn.net/images/ad/dby3_database_120.GIF)color:#fffffffont-size:15ptfont-weight:bold"> 雨中人<br>雨中人<br>
</textarea>
其它
<textarea style="border: 0 overflow: auto color: #FFFFFF background-image: url(http://expert.csdn.net/images/csdn.gif)"></textarea>
设置文本域的字体
<TEXTAREA STYLE="font-size:9ptfont-family:verdanacolor: #ff0000">输入内容</textarea>
设置文本域的背景色
<TEXTAREA STYLE="background-color: #ff0000">输入内容</textarea>
文本域的实线边框设置
<TEXTAREA STYLE="border:1px solid #6CABE7">输入内容</textarea>
浏览器将表单的数据打包后发送给服务器,服务器接收后转由程序处理。
<form>表单元素</form>
表单本身不可见,只是一个区域。
语法:
<input />
属性:
1)type(类型)
可选值:
text(文字域) password(密码域) file(文件域,不同浏览器显示不同) checkbox(复选域,同组name值最好一样.以便服务器区分) radio(单选域,同一组的name值要相同) button(按钮) submit(提交按钮) reset(重置按钮) hidden(隐藏域,用户看不到但可传递到服务器) image(图像域,实际是按钮的功能) checked(单选多选设置默认值)
2)name(文字域的名称)
3)maxlength(最大字符长度)
4)size(文本框的宽度,字符个数为单位,默认20)
5)value(文本框默认值,是要提交给服务器的值)
6)placeholder(提示信息)
2)<select>-菜单和列表标签 <option>-菜单和列表项目标签
优点:
节约网页空间。
语法:
<select>
<option value="">选项1</option>
</select>
select属性:
1)name(名称)
2)multiple(设置可选择多个,会从下拉菜单变为列表菜单,按住ctrl可多选)
3)size(设置列表可见选项数目,会从下拉菜单变为列表菜单)
option属性:
1)selected(默认选中)
2)value(传送给服务器的值)
3)<optgroup>-菜单和列表项目分组标签
语法:
<select>
<optgroup label="组名">
<option>选项</option>
</optgroup>
</select>
4)<textarea>-文字域标签(多行)
语法:
<textarea>内容</textarea>
注意:
开始标签和结束标签之间不要有换行或者空格。
属性:
1)name(名称)
2)placeholder(提示信息)
3)rows(可见行数)
4)cols(可见宽度,只是大约数据)
可以采用以下两种方法来调节文本域的大小即宽高。1、使用rows属性和 cols属性来调节其宽高,实例如下:
<textarea rows="3" cols="20">//rows代表该文本域的行高,cols代表列宽
百度知道
</textarea>
2、也可以使用CSS来控制文本域的宽高。
<textarea style="width:100px height:200px">
//这里的width是宽度,height是高度
百度知道
</textarea>