HTML5单选框、复选框、下拉菜单、文本域的实现代码


Posted in HTML / CSS onDecember 01, 2020

HTML5单选框、复选框、下拉菜单、文本域 单选框的实例代码,代码如下所示:

1单选框代码:

<input type="radio"  name="" id="">  
          <input type="radio" name="" id=""> 
          <input type="radio" name="" id="">

效果:

HTML5单选框、复选框、下拉菜单、文本域的实现代码

复选框

2复选框代码:

<input type="checkbox" name="" id="">篮球
           <input type="checkbox" name="" id="">足球 
           <input type="checkbox" name="" id="">羽毛球
           <input type="checkbox" name="" id="">唱歌
           <input type="checkbox" name="" id="">画画
           <input type="checkbox" name="" id="">敲代码
           <input type="checkbox" name="" id="">阅读

效果;

HTML5单选框、复选框、下拉菜单、文本域的实现代码

下拉菜单

3下拉菜单代码:

年
     <select name="" id=""> 
     <option value="">2020</option>
     <option value="">2021</option>
     <option value="">2022</option>            
     <option value="">2033</option>       
     </select>                 
     月:        
     <select name="" id="">            
     <option value="">5</option>            
     <option value="">6</option>            
     <option value="">7</option>            
     <option value="">8</option>            
     <option value="">9</option>        
     </select>       
      日:        
      <select name="" id="">            
      <option value="">5</option>            
      <option value="">6</option>           
      <option value="">7</option>            
      <option value="">8</option>            
      <option value="">9</option>        
      </select>

效果:

HTML5单选框、复选框、下拉菜单、文本域的实现代码

文本域

4文本域代码:

<input type="textraea">

效果:

HTML5单选框、复选框、下拉菜单、文本域的实现代码

到此这篇关于HTML5单选框、复选框、下拉菜单、文本域的实现代码的文章就介绍到这了,更多相关HTML5单选框、复选框、下拉菜单、文本域内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

HTML / CSS 相关文章推荐
CSS3 Media Queries详细介绍和使用实例
May 08 HTML / CSS
布局和排版教程 纯css3实现图片三角形排列
Oct 17 HTML / CSS
css3的transition属性详解
Dec 15 HTML / CSS
浅谈CSS3动画的回调处理
Jul 21 HTML / CSS
css3实现椭圆轨迹旋转的示例代码
Oct 29 HTML / CSS
js实现移动端H5页面手指滑动刻度尺功能
Nov 16 HTML / CSS
html5-websocket基于远程方法调用的数据交互实现
Dec 04 HTML / CSS
极简的HTML5模版
Jul 09 HTML / CSS
借助HTML5 Canvas API制作一个简单的猜字游戏
Mar 25 HTML / CSS
使用phonegap进行本地存储的实现方法
Mar 31 HTML / CSS
微信html5页面调用第三方位置导航的示例
Mar 14 HTML / CSS
CSS文本阴影 text-shadow 悬停效果详解
May 25 HTML / CSS
Html5页面点击遮罩层背景关闭遮罩层
Nov 30 #HTML / CSS
使用HTML5加载音频和视频的实现代码
Nov 30 #HTML / CSS
Canvas实现放大镜效果完整案例分析(附代码)
Nov 26 #HTML / CSS
HTML5在手机端实现视频全屏展示方法
Nov 23 #HTML / CSS
关于HTML5+ API plusready的兼容问题
Nov 20 #HTML / CSS
Html5原生拖拽相关事件简介以及基础实现
Nov 19 #HTML / CSS
Canvas获取视频第一帧缩略图的实现
Nov 11 #HTML / CSS
You might like
php中var_export与var_dump的区别分析
2010/08/21 PHP
php防止sql注入简单分析
2015/03/18 PHP
Laravel 5框架学习之Blade 简介
2015/04/08 PHP
PHP MPDF中文乱码的解决方式
2015/12/08 PHP
javascript学习笔记(七)利用javascript来创建和存储cookie
2011/04/08 Javascript
jQuery 无刷新分页实例代码
2013/11/12 Javascript
Jquery 切换不同图片示例代码
2013/12/05 Javascript
利用jQuery简单实现产品展示图片左右滚动功能(示例代码)
2014/01/02 Javascript
jQuery操作dom实现弹出页面遮罩层(web端和移动端阻止遮罩层的滑动)
2016/08/25 Javascript
正则表达式替换html元素属性的方法
2016/11/26 Javascript
jQuery Validate 无法验证 chosen-select元素的解决方法
2017/05/17 jQuery
深入解析Vue 组件命名那些事
2017/07/18 Javascript
vue实现键盘输入支付密码功能
2018/08/18 Javascript
Python实现以时间换空间的缓存替换算法
2016/02/19 Python
浅谈Python浅拷贝、深拷贝及引用机制
2016/12/15 Python
python实现求两个字符串的最长公共子串方法
2018/07/20 Python
python实现爬取百度图片的方法示例
2019/07/06 Python
使用Python实现跳一跳自动跳跃功能
2019/07/10 Python
python实现的发邮件功能示例
2019/09/11 Python
python通过对字典的排序,对json字段进行排序的实例
2020/02/27 Python
JAVA高级程序员面试题
2013/09/06 面试题
德尔福集团DELPHI的笔试题
2012/02/22 面试题
幼儿园实习自我鉴定
2013/12/15 职场文书
办护照工作证明范本
2014/01/14 职场文书
中学自我评价
2014/01/31 职场文书
文明倡议书范文
2014/04/15 职场文书
高三上学期学习自我评价
2014/04/23 职场文书
公司晚会策划方案
2014/05/17 职场文书
2015年副班长工作总结
2015/05/15 职场文书
教师节老师寄语
2015/05/28 职场文书
详解nginx.conf 中 root 目录设置问题
2021/04/01 Servers
利用Nginx代理如何解决前端跨域问题详析
2021/04/02 Servers
mysql知识点整理
2021/04/05 MySQL
Java基于字符界面的简易收银台
2021/06/26 Java/Android
JavaScript中isPrototypeOf函数
2021/11/07 Javascript
Mybatis是这样防止sql注入的
2021/12/06 Java/Android