css中的label标签
来源:互联网 发布:r语言数据挖掘 编辑:程序博客网 时间:2024/05/09 03:16
在表单布局中会遇到label标签的使用,label没有任何样式效果,有触发对应表单控件功能。
比如我们点击单选按钮或多选框前文字对应选项就能被选中,这个就是对文字加了<label>标签实现。
一、点击文字,对应选择上控件 - TOP
点击<label>标签文字时,实现对应控件被选择,需要对应表单控件id的值与label标签内的for值相同。
二、label语法 - TOP
<label for="man">男</label>
Label标签内文字更加需要填写
Label标签内for属性的值为自定义,一般与想实现点击会触发控件对象的ID对应相同。
三、label案例 - TOP
HTML代码片段如下:
- <form action="" method="get">
- 性别:<br />
- <input name="sex" id="man" type="radio" value="" />
- <label for="man">男</label>
- <input name="sex" id="woman" type="radio" value="" />
- <label for="woman">女</label>
- </form>
注意查看,input标签内id的值与label标签内for的值对应。
html label标签用法案例截图
总结:
一般要实现点击单选按钮框文字或多选按钮框文字对应选择按钮被选择,使用label标签即可,注意for与id值相同即可实现。Label标签默认情况下是没有任何样式,可以使用CSS设置css宽度、css高度、css边框等样式。
0 0
- css中的label标签
- HTML+CSS基础课程之form表单中的label标签
- html中的label标签
- HTML中的<label>标签
- Html中的label标签
- BootStrap--CSS组件--标签(label)
- form表单中的label标签
- form表单中的label标签
- form表单中的label标签
- form表单中的label标签
- CSS中tabIndex、label、fieldset标签学习
- HTML:form表单中的label标签
- 【Html】form表单中的label标签
- 5-9form表单中的label标签
- html中的<label>标签有什么用?
- javascript中的标签语句label:statement
- label标签
- <label> 标签
- 七层协议介绍
- SSH 、struts 、struts2、 WebWork 、Spring 、Hibernate
- 你不知道的 collider
- CLPlacemark 英文环境下获取中文信息
- HTTP 状态管理机制——RFC6265翻译文档
- css中的label标签
- 输入框-邮箱自动补充
- 菊花怪
- js中获取匿名函数调用的callee和本js匿名函数中的所有文本内容
- pandaboard Rev b3 刷boot和android系统
- java服务器推送消息技术
- LED行业政府补贴好与不好
- C/C++中static关键字作用总结
- 由Strurts2漏洞引开谈谈web代码安全问题