前端知识-标签02

Posted 2020-11-19 happyna

一、文本框标签  <input />
<input type="text" placeholder="请输入用户名" name="username" value="admin">  #value赋值，输入框中默认value中的值
password属性：
<input placeholder="请输入密码" type="password" name="password">          #type类型是密码类型，输入框中输入内容，显示格式是...
<span>是否记住登录</span><input type="checkbox" name="xxx" checked="checked">  #checked="checked勾选框默认是选中状态

性别属性：
<span>男</span><input type="radio" checked="checked" name="sex">    #name后面是性别属性
<span>女</span><input type="radio" name="sex">   #type="radio"  和上面的男互斥，只能选中一个 

button按钮
<input type="button" value="提交">   #提交按钮   button 是需要和js连用，通过js进行提交操作

二：form标签：   input标签是写在form标签内
<form action="http://baidu.com" method="get">   #action后面的是按钮提交后跳转的链接，method后面的是接口类型 get or  post
    <input type="text" value="admin" name="username">
    <!--reset 重置按钮 -->
    <input type="reset">   #重置按钮
    <!--submit如果和form连用，则直接提交表单-->
    <input type="submit" value="登录">   <!--submit提交按钮，点一下按钮，页面会自动刷新一下，自动刷新页面，会让页面内容清空，要全部输入框内容全部重新输入，所以现在一般不用这个按钮提交-->
    <input type="button" value="button登录">   <!--目前前端一般都用button按钮提交-->
</form>
三：laber 标签

<!--laber+input扩展了input的可点击范围  鼠标点击到用户名的时候，输入光标会定位到用户名后面的输入框中，span标签不会这样-->
<label for="i1">用户名</label><input id="i1" type="text" value="admin">
<span>密码</span><input type="password">