当前位置:常识集 > 职场理财 > 职场就业 > 网页表单格式制作
手机版

网页表单格式制作

来源:常识集 阅读:8.76K 次

我们使用webstorm制作HTML网页文件,可以制作表单,根据设置可以制作文本框,单选框,文件选择等功能。

操作方法

(01)制作表单的时候我们需要用到form标签,form标签下我们可以使用label,input文本输入少量单行的文本,如图所示设置我们想要的基本表单,然后点击预览网页显示表单。

网页表单格式制作
网页表单格式制作 第2张

(02)同样的方法,我们给input标签设置一个value内容,这样我们在label标签下,名次输入一栏就有一个默认的学生名次,我们预览就可以看到默认值了。

网页表单格式制作 第3张
网页表单格式制作 第4张

(03)我们添加一个上传文件的label,这时候需要将type类型设置为file,注意我们需要将for属性和ID设置为一致,这样才可以正常使用。

网页表单格式制作 第5张

(04)预览我们的网页,这时候我们可以看到一个按钮,上面显示选择文件,点击选择文件按钮,会弹出一个选择框,这时候可以选择我们需要上传的文件,找到文件所在的位置点击确定打开。

网页表单格式制作 第6张
网页表单格式制作 第7张

(05)在表单中设置一个单选项按钮,我们将type属性设置为radio,然后设置两个选项,如图所示,预览我们的网页,可以看到当我们选择了一个选项之后,还可以选择另外一个。

网页表单格式制作 第8张
网页表单格式制作 第9张

(06)我们可以给每一个选项设置一个ID,这样我们就可以实现选择一个选项之后就能够再选第二个选项了,而且将一个选项设置为checked之后,就默认这个选项处于被选中状态。

网页表单格式制作 第10张
本文链接:https://www.changshiji.com/zclc/jiuye/d54r9.html

Copyright © 2024. 常识集 All right reserved. 浙ICP备20202586号-2

文字美图素材,版权属于原作者。部分文章内容由网友提供推送时因种种原因未能与原作者联系上,若涉及版权问题,敬请原作者联系我们,立即处理。