Html常用标签使用方法汇总

版权声明:转载请附上文章地址 https://blog.csdn.net/weixin_38134491/article/details/85345383
  • <form> </form>

property:  

action:规定提交表单时,向何处发送表单数据

name: 给表单命名

target: _blank 

method:提交方式,post或get值

 

  • <input>标签定义表单的输入界面,通过type属性来展示输入界面,通过value改变默认值

普通文本框:<input type="text"/>

密码框:<input type="password"/>

文件上传:<input type="file"/>

隐藏的input: <input type="hidden"/>

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

单选:<input type="radio"/> 通过相同的name属性来实现单选,如:性别:

           性别:<input type="radio" name="sex"/>男

                     <input type="radio" name="sex"/>女

复选框:<input type="checkbox"/>

提交:<input type="submit"/>

重置:<input type="reset"/>

 

注:

属性checked,可用值checked,一般用于选择输入界面(单选复选),实现默认选择

属性disabled,可用值disabled,几乎所有的输入界面可以使用该属性

属性name,自己给input输入界面起名字

属性readonly,可用值readonly,使输入界面为只读状态

属性size,值为数字,设置输入框长度

属性value,该属性就是这个input最终提交到页面的数据,可以通过该属性设置默认值

 

  • <textarea> </textarea> 标签,定义多行输入框,是双标签, 默认值直接卸载标签之间

 属性:cols,值为数字,属性rows,值为数字

也可以使用上面所说的:disabled,name,readonly属性

  

 标签的for属性与相关的input的id属性相同(点击文字也能选中单选、复选框)

  • <label>标签,提升用户体验
  • <select>标签,配合option标签来实现下拉菜单

可用属性:disabled,name,multiple(多选) 

如: <select>

              <option>无锡</option>

              <option>无锡</option>

               <option>无锡</option>

      </select>

  • <option>标签

可用属性:disabled, selected,value

  • optgroup标签 ,把相关的属性组合在一起

 属性:label,给选项组命名       

属性: disabled

猜你喜欢

转载自blog.csdn.net/weixin_38134491/article/details/85345383