关于html选择框创建占位符的问题


Posted in HTML / CSS onJune 09, 2021

我在文本输入中使用占位符,效果很好。但我也想为我的选择框使用一个占位符。当然,我可以使用以下代码:

<select>
    <option value="">Select your option</option>
    <option value="hurr">Durr</option>
</select>

但是“选择您的选项”是黑色而不是浅灰色。所以我的解决方案可能是基于CSS的。jQuery也很好。

这只会使下拉菜单中的选项变为灰色(因此,单击箭头后):

option:first {
    color: #999;
}

问题是:人们如何在选择框中创建占位符?但它已经得到了回答,欢呼。

使用此方法会导致所选值始终为灰色(即使在选择实选项后):

select {
    color: #999;
}

解决方案:

非CSS-没有JavaScript / jQuery答案:

<select>
    <option value="" disabled selected>Select your option</option>
    <option value="hurr">Durr</option>
</select>

以上就是关于html选择框创建占位符的问题的详细内容,更多关于html选择框占位符的资料请关注三水点靠木其它相关文章!

 
HTML / CSS 相关文章推荐
利用CSS3实现自定义滚动条代码分享
Aug 18 HTML / CSS
纯CSS3实现圆角效果(含IE兼容解决方法)
May 07 HTML / CSS
纯CSS3实现的8种Loading动画效果
Jul 05 HTML / CSS
详解如何在css中引入自定义字体(font-face)
May 17 HTML / CSS
CSS3属性 line-clamp控制文本行数的使用
Mar 19 HTML / CSS
CSS3中的弹性布局em运用入门详解 1em等于多少像素
Feb 08 HTML / CSS
HTML5拖拽的简单实例
May 30 HTML / CSS
完美解决IE8下不兼容rgba()的问题
Mar 31 HTML / CSS
Html5 canvas画图白板踩坑
Jun 01 HTML / CSS
canvas实现滑动验证的实现示例
Aug 11 HTML / CSS
使用layui实现左侧菜单栏及动态操作tab项的方法
Nov 10 HTML / CSS
使用HTML和CSS实现的标签云效果(附demo)
Feb 03 HTML / CSS
html实现弹窗的实例
Jun 09 #HTML / CSS
html css3不拉伸图片显示效果
html2 canvas svg不能识别的解决方案
Jun 03 #HTML / CSS
HTML+CSS 实现顶部导航栏菜单制作
Jun 03 #HTML / CSS
CSS极坐标的实例代码
css height属性中的calc方法详解
Jun 03 #HTML / CSS
html+css实现文字折叠特效实例
You might like
PHP 中的一些经验积累
2006/10/09 PHP
PHP分页显示制作详细讲解
2006/12/05 PHP
Mysql中limit的用法方法详解与注意事项
2008/04/19 PHP
PHP中date()日期函数有关参数整理
2011/07/19 PHP
Yii框架模拟组件调用注入示例
2019/11/11 PHP
jquery插件jbox使用iframe关闭问题
2009/02/09 Javascript
JS 非图片动态loading效果实现代码
2010/04/09 Javascript
Node.js编码规范
2014/07/14 Javascript
深入理解javascript严格模式(Strict Mode)
2014/11/28 Javascript
javascript实现瀑布流自适应遇到的问题及解决方案
2015/01/28 Javascript
jQuery取消特定的click事件
2016/02/29 Javascript
JS数字千分位格式化实现方法总结
2016/12/16 Javascript
ES6学习之变量的解构赋值
2017/02/12 Javascript
详谈jQuery unbind 删除绑定事件 / 移除标签方法
2017/03/02 Javascript
JavaScript学习总结之正则的元字符和一些简单的应用
2017/06/30 Javascript
js实现时分秒倒计时
2019/12/03 Javascript
手动实现vue2.0的双向数据绑定原理详解
2021/02/06 Vue.js
Django框架中数据的连锁查询和限制返回数据的方法
2015/07/17 Python
Python3实现将本地JSON大数据文件写入MySQL数据库的方法
2018/06/13 Python
Python global全局变量函数详解
2018/09/18 Python
PyTorch 1.0 正式版已经发布了
2018/12/13 Python
Django使用 Bootstrap 样式修改书籍列表过程解析
2019/08/09 Python
Django数据结果集序列化并展示实现过程
2020/04/22 Python
Django 用户登陆访问限制实例 @login_required
2020/05/13 Python
python list的index()和find()的实现
2020/11/16 Python
canvas小画板之平滑曲线的实现
2020/08/12 HTML / CSS
售后服务科岗位职责范文
2013/11/13 职场文书
学校门卫工作职责
2013/12/07 职场文书
心得体会怎么写
2013/12/30 职场文书
乡镇信息公开实施方案
2014/03/23 职场文书
2014年社区国庆节活动方案
2014/09/16 职场文书
2014年小学图书室工作总结
2014/12/09 职场文书
婚礼女方父母答谢词
2015/01/04 职场文书
创业计划书之便利店
2019/09/05 职场文书
python文本处理的方案(结巴分词并去除符号)
2021/05/26 Python
MySQL约束(创建表时的各种条件说明)
2022/06/21 MySQL