css中的单选怎么做
导读:收集整理的这篇文章主要介绍了css中的单选怎么做,觉得挺不错的,现在分享给大家,也给大家做个参考。在css中,可以使用radio对象制作单选,只需要在input元素中设置“”样式即可。单选按钮是表示一组互斥选项按钮中的一个;当一个按钮被选中...
收集整理的这篇文章主要介绍了css中的单选怎么做,觉得挺不错的,现在分享给大家,也给大家做个参考。在css中,可以使用radio对象制作单选,只需要在input元素中设置“”样式即可。单选按钮是表示一组互斥选项按钮中的一个;当一个按钮被选中,之前选中的按钮就变为非选中的。
本教程操作环境:windows7系统、CSS3& & HTML5版、Dell G3电脑。
一、单选按钮控件语法
input name="FruIT" tyPE="radio" value="" />
使用html input标签,name为自定义,type类型为“radio”的表单,
Radio 对象代表 HTML 表单中的单选按钮。
在 HTML 表单中 input type="radio"> 每出现一次,一个 Radio 对象就会被创建。
单选按钮是表示一组互斥选项按钮中的一个。当一个按钮被选中,之前选中的按钮就变为非选中的。
当单选按钮被选中或不选中时,该按钮就会触发 onclick 事件句柄。
您可通过遍历表单的 elements[] 数组来访问 Radio 对象,或者通过使用 document.getElementById()。
二、radio单选按钮语法案例
html代码
!DOCTYPE html> html lang="en"> head> meta charset="UTF-8" /> meta http-equiv="X-UA-Compatible" content="IE=Edge" /> meta name="viewport" content="width=device-width, initial-scale=1.0" /> title> Document/title> /head> body> form action="" method="get"> 您最喜欢水果?br /> br /> label> input name="Fruit" type="radio" value="" /> 苹果 /label> label> input name="Fruit" type="radio" value="" /> 桃子 /label> label> input name="Fruit" type="radio" value="" /> 香蕉 /label> label> input name="Fruit" type="radio" value="" /> 梨 /label> label> input name="Fruit" type="radio" value="" /> 其它 /label> /form> /body> /html>
截图
推荐学习:css视频教程
以上就是css中的单选怎么做的详细内容,更多请关注其它相关文章!
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: css中的单选怎么做
本文地址: https://pptw.com/jishu/589536.html