营销型网站建设<inpup>元素

营销<input>元素用来定义用户输入数据的输入字段,根据不同的type属性,输入字段可以是文本字段、密码字段、复选框、单选钮、按钮、隐藏域、电子邮件、日期时间、数值、范围、图像、文件等。<input元素的基本语法及格式为:<input type="表项类型" name="表项名" value="默认值"size="x" maxlength="y"><input>元素常用属性的含义如下。

type属性:指定要加入表单项目的类型(text, password, checkbox, radio, button, hidden,email, date pickers, number, range, image, file, submit或reset等)。

name属性:该表项的控制名,主要在处理表单时起作用。

size属性:输入字段中的可见字符数。

maxlength属性:允许输入的最大字符数目。

checked属性:当页面加载时是否预先选择该input元素(适用于type="checkbox"或type="radio")。

step属性:输入字段的合法数字间隔。

max属性:输入字段的最大值。

min属性:输入字段的最小值。

required属性:设置必须输入字段的值。

pattern属性:输入字段的值的模式或格式。

readonly属性:设置字段的值无法修改。

placeholder属性:设置用户填写输入字段的提示。

autocomplete属性:设置是否使用输入字段的自动完成功能。

autofocus属性:设置输入字段在页面加载时是否获得焦点(不适用于type-"hidden")。

disabled属性:设置当页面加载时是否禁用该input元素(不适用于type-"hidden")。

1、文字和密码的输入

使用<input元素的type属性,可以在网站表单中加入表项,并控制表项的风格。如果type属性值为text,则输入的文本以标准的字符显示;如果type属性值为password,则输入的文本显示为“*",在表项前应加入表项的名称,如“您的姓名”等,以告诉浏览者在随后的表项中应该输入的内容。文本框和密码框的格式为:<input types"text" name="文本框名"><input type-"password"name="密码框名"

2、重置和提交

如果浏览者想清除输入到表单中的全部内容,可以使用<input>元素中的type属性设置重置(reset)按钮,以省去在重新输入前,一项一项删除的麻烦;当浏览者完成表单的填写,想要发送时,可使用<input元素的type属性设置的提交(submit)按钮,将表单内容送给action属性中的网址或函件信箱;如果浏览者想制作一个普通的按钮,可使用<input元素的type属性设置普通(button)按钮。三种按钮的格式为:

<input type="reset" value="按钮名">

<input type-"submit"value="按钮名">

<input type="button" value-"按钮名">

当省略value的设置值时,重置和提交的按钮分别显示为“重置”和“提交”

3、复选框和单选钮

在页面中有些地方需要列出几个项目,让浏览者通过选择钮来选择项目。选择钮可以是复选框(checkbox)或单选钮(radio)。用<input元素的type属性可设置选择钮的类型; value属性可设置该选择钮的控制初值,用来告诉表单制作者选择结果;用checked属性表示是否为默认选中项; name属性是控制名,同一组的选择钮的控制名是一样的。复选框和单选钮的格式为：

<input type="checkbox" name-"复选框名" value-"提交值">.

<input type="radio" name="单选钮名"value="提交值">

4,电子邮件输入框

当用户需要通过营销型网站建设表单提交电子邮件信息时,可以将<input>元素的type属性设置为email类型,即设计用于包含email地址的输入框。当用户提交表单时,会自动验证输入email值的合法性。格式为:<input type-"email" name="电子邮件输入框名">

5、日期时间选择器

HTML5提供了日期时间选择器date pickers,拥有多个可供选取日期和时间的新型输入文本框，类型如下。

date:选取日、月、年。

month:选取月、年。

week:选取周和年。

time:选取时间(小时和分钟)。

datetime:选取时间日、月、年(UTC世界标准时间)。

datetime-local:选取时间日、月、年(本地时间)。

日期时间选择器的语法格式为:

<input type"选择器类型" name="选择器名">