关于单选复选框

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>单选复选框</title>
<link href="style.css" rel="stylesheet">
</head>
<body bgcolor="pink">
<center>
<h1 style="background-color:rgb(7, 245, 243);">请填写以下信息并提交</h1>
<div style="color:red">
<form action="tijiao.html">
姓名: <input type="text" name="yonghuming" id="yonghuming" required><br>
班级: <input type="text" name="mima" id="mima" required><br>
年龄：<input type="text" name="nianling" id="nianling" required><br>
性别：<input type="text" name="xingbie" id="xingbie" required><br>
爱好：<input type="text" name="miaihao" id="aihao" required><br>
邮箱：<input type="text" name="youxiang" id="youxiang" required><br>
</div>
<div style="color:rgb(97, 238, 19)">
<p>你喜欢旅游吗？</p>
<input type="radio" name="like" value="喜欢" />喜欢
<input type="radio" name="like" value="不喜欢" />不喜欢
<input type="radio" name="like" value="一般" />一般
</div>
<div style="color:blue">
你喜欢什么运动？<br/>
<label><input name="sport" type="checkbox" value="跑步" />跑步 </label>
<label><input name="sport" type="checkbox" value="篮球" />篮球 </label>
<label><input name="sport" type="checkbox" value="足球" />足球 </label>
<label><input name="sport" type="checkbox" value="羽毛球" />羽毛球 </label>
<label><input name="sport" type="checkbox" value="跳高" />跳高 </label>
<label><input name="sport" type="checkbox" value="攀岩" />攀岩 </label>
<label><input name="sport" type="checkbox" value="跳绳" />跳绳 </label> <br>
<input type="submit" value="提交">
</form>
</div>
</center>
</body>
</html>

原文地址：https://www.cnblogs.com/xiaoyueyuedeboke/p/9650723.html

时间： 2024-11-10 10:41:59

关于单选复选框的相关文章

[SAP ABAP开发技术总结]选择屏幕——按钮、单选复选框

目录导航 声明:原创作品,转载时请注明文章来自SAP师太博客,并以超链接形式标明文章原始出处,否则将追究法律责任!原文出自: 12.6.         按钮.单选复选框.下拉框的FunCode. 91 12.6.1.     选择屏幕中的按钮... 92 12.6.2.     选择屏幕中的单选/复选按钮:点击时显示.隐藏其他屏幕元素... 92 12.6.     按钮.单选复选框.下拉框的FunCode 如果复选框与单选按钮没有设置Function Code,则它们就会像普通的输入框一样,

单选复选框的制作

一.选择框 在使用表单设计调查表时,为了减少用户的操作,使用选择框是一个好主意,html中有两种选择框,即单选框和复选框,两者的区别是单选框中的选项用户只能选择一项,而复选框中用户可以任意选择多项,甚至全选. 语法: <input type="radio/checkbox" value="值" name="名称" checked="checked"/> 1.当type="radio"时,为单选框

单选复选框的js代码取值

单选框 复选框选中后的js代码处理 <script type="text/javascript"> function check(){ document.getElementById("checked").style.display="block"; var radio=document.getElementsByName("sex");//此处不能getElementById(),否则只会取第一个的值 for(v

Asp.net自定义单选复选框控件

将常用的jquery插件封装成控件也是个不错的选择 下面是效果的简单颜色,由于博客系统的限制没法完整演示最终效果,请下载示例查看 Asp.netWeb APIC#Javascript 1.新建类库项目,创建数据源类 [Serializable] public class Select2Item { public bool Selected { get; set; } public string Text { get; set; } public string Value { get; set;

文字与单选复选框对齐

<style> .box3>input { vertical-align: middle; margin-top: -2px; margin-bottom: 1px } </style> <p> vertical-align: middle;margin-top: -2px;margin-bottom: 1px</p> <p>把此元素放置在父元素的中部</p> <div class="box3">

[CSS揭秘]自定义单选框和复选框

很多Web前端工程师肯定都会遇到过,在项目中,UI设计师跑来跟你说,我这个地方的表单控件需要设计成这个样子那个样子.但是用CSS却不能够修改这些控件的默认样式,于是乎,只能通过div+javascript技术来进行模拟.特别是在如今移动端的崛起时代,更加注重用户的体验.于是就更加需要这样一种hack技术. 如果对如今的前端框架有过了解,都会知道组件这个概念.那么在这些框架中,都会提供一些单选框或复选框按钮组件.可见大家之前受到表单元素的默认样式的毒害有多深. 今天先给大家简单介绍一下如何通过CS

vue.js实现单选框、复选框和下拉框

Vue.js可以很方便的实现数据双向绑定,所以在处理表单,人机交互方面具有很大的优势.下边以单选框.复选框和下拉框为例介绍他们在HTML和Vue.js中的具体实现方式. 一.单选框 在传统的HTML中实现单选框的方法如下: <div id="app"> <input type="radio" name="gender" value="man" id="man"/><label

单选框与复选框的实现

<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.hanqi.test5"> <application android:allowBackup="true" android:icon=&q

android 单选框和复选框

<?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_heig