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视频教程

原文地址：https://www.jb51.cc/css/1205550.html

css中的单选怎么做

一、单选按钮控件语法

二、radio单选按钮语法案例

相关推荐