HTML5输入框下拉菜单功能的示例代码
2020-09-20 04:09
1671 查看
1.单选框代码
<span>性别:</span> <input name="sex" value="" type="radio">男 <input name="sex" value="" type="radio">女
需要注意的是单选框name值需保持一致
样式:
复选框
2.复选框代码
<span>喜欢的类型:</span> <input type="checkbox">妩媚的 <input type="checkbox">可爱的 <input type="checkbox">小鲜肉 <input type="checkbox">老腊肉 <input type="checkbox">都喜欢
如需要进行form表单提交 则需要name的属性一样
样式:
文本框
3.文本框代码示例
<span>所在地区:</span> <input type="text">
代码运行界面样式:
文本域
4.文本域代码示例
<span class="te2">自我介绍:</span> <textarea rows="2" cols="21"></textarea>
注意点:
rows相当于height , cols相当于width
若想设置为禁止拖动则添加代码
<textarea style="resize:none;"></textarea>
代码运行示例:
下拉菜单
5.下拉菜单代码示例:
<select name="" id=""> <option value="" disabled selected hidden>--请选择月--</option> <option value="">1</option> <option value="">2</option> <option value="">3</option> <option value="">4</option> <option value="">5</option> <option value="">6</option> <option value="">7</option> <option value="">8</option> <option value="">9</option> <option value="">10</option> <option value="">11</option> <option value="">12</option> </select>
注意点:disabled selected hidden这是设置下拉菜单默认提示文字
代码运行演示:
到此这篇关于HTML5输入框下拉菜单功能的示例代码的文章就介绍到这了,更多相关HTML5输入框下拉菜单内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!
相关文章推荐
- JS实现仿百度输入框自动匹配功能的示例代码
- JS实现仿百度输入框自动匹配功能的示例代码
- JS实现仿百度输入框自动匹配功能的示例代码
- HTML5中input输入框默认提示文字向左向右移动的示例代码
- 代码希望HTML5初探-CSS3新特性小示例
- html5为输入框添加语音输入功能
- Html5实现用户注册自动校验功能实例代码
- ThinkPHP结合ajax、Mysql实现的客户端通信功能代码示例
- element-ui组件table实现自定义筛选功能的示例代码
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载续][重点推荐控件]
- javascript弹出层输入框(示例代码)
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载]
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载]
- 非html5实现js版弹球游戏示例代码
- HTML5注册页面示例代码
- HTML5 Canvas实现图片缩放、翻转、颜色渐变的代码示例
- html5播放器的示例代码
- Asp.net 2.0 自定义控件开发[实现自动计算功能(AutoComputeControl)][示例代码下载续][重点推荐控件]
- java web开发之购物车功能实现示例代码
- lucene功能二:查询索引步骤;及代码示例