HTML 中使用 datalist 标签给输入框添加下拉框选项
HTML CSS 大约 598 字图片展示
代码实现
最主要是datalist标签和input的list属性。
<input placeholder="搜索..." type="search" autocomplete="off" list="custom-datalist">
<datalist id="custom-datalist">
<option value="IDEA">PhpStorm/WebStorm/PyCharm</option>
<option value="Java">Spring Boot</option>
<option value="OpenResty">Lua</option>
<option value="PostgreSQL">pgadmin</option>
<option value="小程序">
</datalist>去除箭头
去除input输入框上的下拉箭头。
/*移除datalist下拉箭头*/
input::-webkit-calendar-picker-indicator {
display: none;
-webkit-appearance: none;
}
阅读 1909 · 发布于 2020-03-15
———— END ————
扫描下方二维码关注公众号和小程序↓↓↓
昵称：
随便看看
换一批
-
CentOS7 安装 Docker阅读 1944
-
Vue mavonEditor 获取 HTML 代码阅读 644
-
OpenResty 使用 lua-resty-auto-ssl 配置 https 证书阅读 551
-
JMeter 当前接口请求失败停止请求下一个接口阅读 152
-
HTML 自定义表单验证信息阅读 202
-
Test.class found in top-level directory (unnamed package not allowed in module)阅读 643
-
Linux 添加 iptables 防火墙规则阅读 1032
-
Linux 之 Ubuntu apt-get 更换镜像阅读 1566
-
MongoDB uri 连接规则阅读 2341
-
Git 命令之查看及设置用户名邮箱阅读 1523