前端基础--系列一



1、from标签就是作为表单数据的根标签,所有的标签数据都要写在form的里面
<form action="某一个后台程序" method="具体用什么方法">
action属性的值就是要把所有的表单内容,传递给哪一个后台来解决
method代表传输数据时候的方法;get代表明文传送,post代表简单的加密传输

2、type = "text" 代表普通的输入框 placeholder属性中可以设置用户的提醒文字
<input type="text" placeholder="请输入用户名" />

3、密码框 type = "password"
密码框:<input type="password">

4、单选
框 <input type="radio" />
关注点击的时候 是否为单选效果;点击文字也可以实现切换效果,可提升用户体验
name:是实现单选
label中 的for 和input 的id若一致,则可以实现联动效果
性别:<input type="radio" name="xb" id="nan" /><label for="nan">男</label>
<input type="radio" name="xb" id="nv" /><label for="nv">女</label>
<input type="radio" name="xb" id="bm" /><label for="bm">保密</label>
5、复选框 input type="checkbox"
复选框、多选框:可以全部点选,也可以点击一部分;点击文字也可以实现切换效果,可提升用户体验
爱好:<input type="checkbox" id="cf"/><label for="cf">吃饭</label>
<input type="checkbox" id="sj"/><label for="sj">睡觉</label>
<input type="checkbox" id="ddd"/><label for="ddd">打豆豆</label>
6、下拉菜单
<select>
<option value ="">北京</option>
<option value ="">上海</option>
<option value ="">广州</option>
</select>
注意默认选项是否符合要求;总共的下拉可选数也要符合要求

7、文本域
<textarea name="" id="" cols="40" row="30" placeholder="请填写您的意见"></textarea>

<!-- cols和rows分别代表行和列,程序员一般不用这个属性,因为存在兼容性问题,需使用css来解决, 右下角的按钮要关闭,不允许用户自行改变大小-->

8、按钮
普通按钮:<input type="button" value="按钮" />

重置按钮:<input type="reset" value="重置" />
<!-- type='reset' 重置按钮,value属性也要设置,因为如果不设置,浏览器就会自己写入一个默认值,此按钮的效果是点击后重置页面中的表单数据而非清空 -->

提交按钮:<input type="submit" value="提交" />
<!-- 此按钮点击后会把表单中的数据 上传到form标签中的action里面的值所对应的后台程序,value别忘了自己需要设置,否则会有兼容性问题 -->

9、默认选中状态
单选框中的默认选中:
<input type="radio" name="xb" id="nv" checked="checked"/><label for="nv">女</label>
多选框中的默认选中:
<input type="checkbox" id="sj" checked="checked"/><label for="sj">睡觉</label>
下拉框中的默认选中:
<option value ="" selected="selected">上海</option>
#前端#
全部评论
牛逼
1 回复 分享
发布于 2020-12-08 21:59
你要转战前端吗?
1 回复 分享
发布于 2020-12-08 21:14

相关推荐

02-04 17:01
南昌大学 Java
牛客96763241...:拿插件直接投就完了,这玩意看运气的
点赞 评论 收藏
分享
评论
3
2
分享

创作者周榜

更多
正在热议
更多
# 春招至今,你的战绩如何? #
8751次浏览 80人参与
# 你的实习产出是真实的还是包装的? #
1619次浏览 40人参与
# 米连集团26产品管培生项目 #
5537次浏览 214人参与
# 军工所铁饭碗 vs 互联网高薪资,你会选谁 #
7337次浏览 40人参与
# 重来一次,我还会选择这个专业吗 #
433258次浏览 3926人参与
# 简历第一个项目做什么 #
31475次浏览 324人参与
# 巨人网络春招 #
11287次浏览 223人参与
# 当下环境,你会继续卷互联网,还是看其他行业机会 #
186809次浏览 1118人参与
# 不考虑薪资和职业,你最想做什么工作呢? #
152237次浏览 887人参与
# 研究所笔面经互助 #
118840次浏览 577人参与
# 简历中的项目经历要怎么写? #
309904次浏览 4183人参与
# 面试紧张时你会有什么表现? #
30466次浏览 188人参与
# 你今年的平均薪资是多少? #
212956次浏览 1039人参与
# AI时代,哪些岗位最容易被淘汰 #
63258次浏览 793人参与
# 我的求职精神状态 #
447945次浏览 3128人参与
# 你最满意的offer薪资是哪家公司? #
76388次浏览 374人参与
# 高学历就一定能找到好工作吗? #
64275次浏览 620人参与
# 牛客AI文生图 #
21395次浏览 238人参与
# 你怎么看待AI面试 #
179751次浏览 1224人参与
# 正在春招的你,也参与了去年秋招吗? #
363105次浏览 2635人参与
# 腾讯音乐求职进展汇总 #
160539次浏览 1109人参与
# 职能管理面试记录 #
10787次浏览 59人参与
牛客网
牛客网在线编程
牛客网题解
牛客企业服务