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动画效果抖动解决方法
Sep 03 HTML / CSS
css3 box-sizing属性使用参考指南
Jan 08 HTML / CSS
css3实现背景图片拉伸效果像桌面壁纸一样
Aug 19 HTML / CSS
浅谈pc和移动端的响应式的使用
Jan 03 HTML / CSS
html5 web本地存储将取代我们的cookie
Dec 26 HTML / CSS
Html5无刷新修改browser Url的方法
Jan 15 HTML / CSS
基于HTML5新特性Mutation Observer实现编辑器的撤销和回退操作
Jan 11 HTML / CSS
浅谈Html5中视频 音频标签 进度条的问题
Jul 26 HTML / CSS
HTML5本地存储和本地数据库实例详解
Sep 05 HTML / CSS
data:image data url 文件转为Blob上传后端的方法
Jul 16 HTML / CSS
AmazeUI 平滑滚动效果的示例代码
Aug 20 HTML / CSS
HTML中link标签属性的具体用法
May 07 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计算2个日期的差值函数分享
2015/02/02 PHP
ecshop实现smtp发送邮件
2015/02/03 PHP
PHP+Ajax实时自动检测是否联网的方法
2015/07/01 PHP
PHP实现搜索地理位置及计算两点地理位置间距离的实例
2016/01/08 PHP
Laravel 实现Controller向blade前台模板赋值的四种方式小结
2019/10/22 PHP
JavaScript实现表格排序方法
2013/06/14 Javascript
Express.JS使用详解
2014/07/17 Javascript
JavaScript获得页面base标签中url的方法
2015/04/03 Javascript
使用AmplifyJS组件配合JavaScript进行编程的指南
2015/07/28 Javascript
快速掌握WordPress中加载JavaScript脚本的方法
2015/12/17 Javascript
JS实现的自定义显示加载等待图片插件(loading.gif)
2016/06/17 Javascript
JS条形码(一维码)插件JsBarcode用法详解【编码类型、参数、属性】
2017/04/19 Javascript
浅谈js基础数据类型和引用类型,深浅拷贝问题,以及内存分配问题
2017/09/02 Javascript
nodejs实现OAuth2.0授权服务认证
2017/12/27 NodeJs
还不懂递归?读完这篇文章保证你会懂
2018/07/29 Javascript
vue router 源码概览案例分析
2018/10/09 Javascript
three.js中多线程的使用及性能测试详解
2021/01/07 Javascript
python二分法实现实例
2013/11/21 Python
Python的Django中django-userena组件的简单使用教程
2015/05/30 Python
Django入门使用示例
2017/12/12 Python
python ChainMap 合并字典的实现步骤
2019/06/11 Python
TensorFlow中如何确定张量的形状实例
2020/06/23 Python
python3爬虫中多线程的优势总结
2020/11/24 Python
python opencv肤色检测的实现示例
2020/12/21 Python
使用纯 CSS 创作一个脉动 loader效果的源码
2018/09/28 HTML / CSS
详解HTML5中download属性的应用
2015/08/06 HTML / CSS
Stuarts London美国/加拿大:世界领先的独立男装零售商之一
2019/03/18 全球购物
高中毕业生生活的自我评价
2013/12/08 职场文书
小学毕业演讲稿
2014/04/25 职场文书
优秀乡村医生事迹材料
2014/05/28 职场文书
会计毕业生自荐书
2014/06/12 职场文书
上课迟到检讨书300字
2014/10/15 职场文书
抄袭同学作业检讨书1000字
2014/11/20 职场文书
武夷山导游词
2015/02/03 职场文书
CSS实现渐变色边框(Gradient borders)的5种方法
2022/03/25 HTML / CSS
Apache POI操作批量导入MySQL数据库
2022/06/21 Servers