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的appearance属性改变任何元素的浏览器默认风格
Dec 24 HTML / CSS
利用CSS3实现进度条的两种姿势详解
Mar 21 HTML / CSS
CSS3 按钮边框动画的实现
Nov 12 HTML / CSS
HTML5 离线应用之打造零请求、无流量网站的解决方法
Apr 25 HTML / CSS
html5 CSS过度-webkit-transition使用介绍
Jul 02 HTML / CSS
HTML5 CSS3打造相册效果附源码下载
Jun 16 HTML / CSS
利用HTML5中的Canvas绘制一张笑脸的教程
May 07 HTML / CSS
Adobe Html5 Extension开发初体验图文教程
Nov 14 HTML / CSS
详解html5 postMessage解决跨域通信的问题
Aug 17 HTML / CSS
浅析canvas元素的html尺寸和css尺寸对元素视觉的影响
Jul 22 HTML / CSS
css3 filter属性的使用简介
Mar 31 HTML / CSS
基于CSS3画一个iPhone
Apr 21 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中$_REQUEST、$_POST、$_GET的区别和联系小结
2011/11/23 PHP
codeigniter教程之多文件上传使用示例
2014/02/11 PHP
深入浅析PHP无限极分类的案例教程
2016/05/09 PHP
Javascript Global对象
2009/08/13 Javascript
javaScript矢量图表库-gRaphael几行代码实现精美的条形图/饼图/点图/曲线图
2013/01/09 Javascript
JS是按值传递还是按引用传递
2015/01/30 Javascript
vue 多入口文件搭建 vue多页面搭建的实例讲解
2018/03/12 Javascript
在vue项目中使用sass的配置方法
2018/03/20 Javascript
js实现各浏览器全屏代码实例
2018/07/03 Javascript
vue插件开发之使用pdf.js实现手机端在线预览pdf文档的方法
2018/07/12 Javascript
详解node.js的http模块实例演示
2018/07/12 Javascript
vue中使用codemirror的实例详解
2018/11/01 Javascript
浅谈JavaScript_DOM学习篇_图片切换小案例
2019/03/19 Javascript
vue-cli中使用高德地图的方法示例
2019/03/28 Javascript
p5.js码绘“跳动的小正方形”的实现代码
2019/10/22 Javascript
[04:19]DOTA2完美大师赛第四天精彩集锦
2017/11/26 DOTA
浅析Python3爬虫登录模拟
2018/02/07 Python
Windows下python3.6.4安装教程
2018/07/31 Python
详解用Python实现自动化监控远程服务器
2019/05/18 Python
python通过SSH登陆linux并操作的实现
2019/10/10 Python
keras自动编码器实现系列之卷积自动编码器操作
2020/07/03 Python
python使用ctypes库调用DLL动态链接库
2020/10/22 Python
一张图片能隐含千言万语之隐藏你的程序代码
2012/12/13 HTML / CSS
HTML5 audio标签使用js进行播放控制实例
2015/04/24 HTML / CSS
全球领先的鞋类零售商:The Walking Company
2016/07/21 全球购物
荷兰优雅女装网上商店:Heine
2016/11/14 全球购物
美国顶级品牌男士大码服装店:DXL
2017/08/30 全球购物
校运会口号
2014/06/18 职场文书
西柏坡导游词
2015/02/05 职场文书
2015年七一建党节活动总结
2015/03/20 职场文书
教学督导岗位职责
2015/04/10 职场文书
2015年公司保安年终工作总结
2015/05/14 职场文书
商务宴会祝酒词
2015/08/11 职场文书
数学备课组工作总结
2015/08/12 职场文书
pytorch中的model.eval()和BN层的使用
2021/05/22 Python
教你如何使用Python实现二叉树结构及三种遍历
2021/06/18 Python