<html lang="en">
<head>
<h1>大学生爱好调查</h1>
<meta charset="utf-8">
<title>大学生爱好调查</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<p>请花几分钟填写以下内容</p>
<hr> <form action="" method="get" class="">
<div class="form-example">
<label for="name">输入您的姓名:</label>
<input type="text" name="name" required="required"><br><br>
请输入您的E-mail: <input type="email" name="usremail" required="required"><br><br>
您的年龄段是?<select>
<option value="1">80后</option>
<option value="2">90后</option>
<option value="3">00后</option>
<option value="4">其他</option>
</select>
</div>
<div>
<p>请选择您的性别:</p>
<label><input type="radio" name="1"> 男</label>
<label><input type="radio" name="1"> 女</label>
</div>
<div>
<p>请选择您的爱好(多选):</p>
<label><input type="checkbox" name=""> 学习</label>
<label><input type="checkbox" > 运动</label>
<label><input type="checkbox" > 游戏</label>
<br><br>
<textarea rows="10" cols="30">请填写您的座右铭。
</textarea><br><br>
<input type="reset" value="重置">
<input type="submit" value="提交">
     </div>
<br>
</form>
<a href="http://www.bilibili.com">友情链接!</a>
<script src="script.js"></script>
</body>
</html>

图片展示:

练习-HTML表单的更多相关文章

  1. ASP.NET Aries 入门开发教程9:业务表单的开发

    前言: 经过前面那么多篇的列表的介绍,终于到了大伙期待的表单开发了. 也是本系列的最后一篇文章了! 1:表单页面的权限设置与继承 对于表单页面,权限的设置有两种: 1:你可以选择添加菜单(设置为不显示 ...

  2. 探索ASP.NET MVC5系列之~~~3.视图篇(下)---包含常用表单和暴力解猜防御

    其实任何资料里面的任何知识点都无所谓,都是不重要的,重要的是学习方法,自行摸索的过程(不妥之处欢迎指正) 汇总:http://www.cnblogs.com/dunitian/p/4822808.ht ...

  3. jQuery学习之路(8)- 表单验证插件-Validation

    ▓▓▓▓▓▓ 大致介绍 jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 ...

  4. jQuery学习之路(5)- 简单的表单应用

    ▓▓▓▓▓▓ 大致介绍 接下来的这几个博客是对前面所学知识的一个简单的应用,来加深理解 ▓▓▓▓▓▓ 单行文本框 只介绍一个简单的样式:获取和失去焦点改变样式 基本结构: <form actio ...

  5. 12、Struts2表单重复提交

    什么是表单重复提交 表单的重复提交: 若刷新表单页面, 再提交表单不算重复提交. 在不刷新表单页面的前提下: 多次点击提交按钮 已经提交成功, 按 "回退" 之后, 再点击 &qu ...

  6. .net erp(办公oa)开发平台架构概要说明之表单设计器

    背景:搭建一个适合公司erp业务的开发平台.   架构概要图: 表单设计开发部署示例图    表单设计开发部署示例说明1)每个开发人员可以自己部署表单设计至本地一份(当然也可以共用一套开发环境,但是如 ...

  7. javascript表单的Ajax 提交插件的使用

    Ajax 提交插件 form.js 表单的下载地址:官方网站:http://malsup.com/jquery/form/ form.js 插件有两个核心方法:ajaxForm()和ajaxSubmi ...

  8. 玩转spring boot——AOP与表单验证

    AOP在大多数的情况下的应用场景是:日志和验证.至于AOP的理论知识我就不做赘述.而AOP的通知类型有好几种,今天的例子我只选一个有代表意义的“环绕通知”来演示. 一.AOP入门 修改“pom.xml ...

  9. from表单提交数据之后,后台对象接受不到值

    如果SSH框架下,前段页面通过from表单提交数据之后,在后台对象显示空值,也就是接收不到值得情况下.首先保证前段输入框有值,这个可以在提交的时候用jQuery的id或者name选择器alert弹出测 ...

  10. form表单验证-Javascript

    Form表单验证: js基础考试内容,form表单验证,正则表达式,blur事件,自动获取数组,以及css布局样式,动态清除等.完整代码如下: <!DOCTYPE html PUBLIC &qu ...

随机推荐

  1. 开源DDD设计模式框架YMNNetCoreFrameWork第6篇-.net Core Logging和Nlog结合

    源码地址:https://github.com/topgunymn/YMNNetCoreFrameWork 遇到的坑:使用了Nlog以后,.NETcore自带的日志等级不起作用,只有nlog配置配置文 ...

  2. 一、JavaScript之第一个实例,点击按钮修改文本内容

    一.代码如下: 二.运行后效果如下 三.点击按钮,"曾经沧海难为水"变成了日期事件了 <!DOCTYPE html> <html> <meta htt ...

  3. ServletConfig详解

    ServletConfig是Servlet中的init()方法的参数类型,服务器会在调用init()方法时传递ServletConfig对象给init()方法.   ServletConfig对象封装 ...

  4. 二、react开发环境配置与webpack入门

    Webpack 模块打包工具(module bundler)功能: 将 CSS.图片与其他资源打包 打包之前预处理(Less.CoffeeScript.JSX.ES6 等)档案 依 entry 文件不 ...

  5. MongoDB 教程

    版权所有,未经许可,禁止转载 章节 MongoDB 入门 MongoDB 优势 MongoDB 安装 MongoDB 数据建模 MongoDB 创建数据库 MongoDB 删除数据库 MongoDB ...

  6. Java高级特性——注解,这也许是最简单易懂的文章了

    最近,浪尖在做flink的项目时source和sink的绑定那块用到了注解,当然新版本1.6以后就变为server load的方式加载. 但是浪尖也是觉得很有毕业讲一下注解,毕竟高级免试也会问答的吧. ...

  7. 修改element-ui里table中悬浮框中三角号的颜色及透明度设置

    .el-tooltip__popper,.el-tooltip__popper.is-dark{background:rgba(0,0,0,0.6) !important;} .el-tooltip_ ...

  8. linux X64函数参数传递过程研究

    基础知识 函数传参存在两种方式,一种是通过栈,一种是通过寄存器.对于x64体系结构,如果函数参数不大于6个时,使用寄存器传参,对于函数参数大于6个的函数,前六个参数使用寄存器传递,后面的使用栈传递.参 ...

  9. Ubuntu Vi指令

    Ubuntu在不更新源的情况下是没办法使用Vim指令的只能使用Vi指令 所有我也就记录了下来 vi / vim命令: 插入内容: i: 插入光标前一个字符 I: 插入行首 a: 插入光标后一个字符 A ...

  10. Ubuntu Navicat链接mysql (9.17第六天)

    Navicat链接MySQL 首先要在虚拟机里面下载好MySQL,在宿主机里面下载好Navicat Navicat下载及安装教程:https://blog.csdn.net/jsnhux/articl ...