antdVue 重置select和input的样式 去掉蓝色换成灰色

代码实现:
<template>
<div>
<a-select mode="tags" style="width: 200px" placeholder="请选择" @change="handleChange">
<a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">
{{ (i + 9).toString(36) + i }}
</a-select-option>
</a-select>
<a-input placeholder="请输入" style="width: 200px"/>
</div>
</template>
<script>
export default {
name: 'test',
methods:{
handleChange(value) {
console.log(`selected ${value}`);
},
}
}
</script>
<style>
/* 重置selectl开始 */
.ant-select-dropdown-menu-item-active,
.ant-select-dropdown-menu-item:hover {
background-color: #edf2f5;
}
.ant-select-focused .ant-select-selection,
.ant-select-selection:focus,
.ant-select-selection:active {
border-color: #cccccc;
box-shadow: 0 0 0 2px rgba(0, 0, 0, 0);
} .ant-select-selection:hover {
border-color: #cccccc;
}
/* 重置selectl结束 */
/* 重置input开始 */
.ant-input,.ant-input:focus,
.ant-input:hover,
.ant-input:active,
.ant-input-affix-wrapper:hover .ant-input:not(.ant-input-disabled)
{
border-color: #cccccc;
box-shadow: 0 0 0 2px rgba(0, 0, 0, 0);
}
/* 重置input结束 */
</style>
antdVue 重置select和input的样式 去掉蓝色换成灰色的更多相关文章
- input清空和重置select下拉框
背景 一般页面搜索条件都会有input输入框和select选择框,同时页面上都会有重置reset按钮,这时就需要清空input和重置select 实现 清空input 清空单个input: $(&qu ...
- input range样式更改,模拟滑块
input range 样式更改,js模拟滑块实时更新数据. 效果图: html 代码: <div> <span class="slider"></s ...
- vue2.0结合Element实现select动态控制input禁用
今天有一个盆友问小颖,怎么实现用select动态控制input禁用,也就是说,input默认是可编辑的,但是每当我选一次select,input就会变成禁用,虽然小颖不知道她为什么这样做,因为小颖觉得 ...
- 闲聊select和input常用的小插件
前言 在pc端的项目中,经常会用到表单标签,莫过于是select和input这两种,这两种相当常用.但往往原生的功能不尽人意,即使 input中type有n多属性,甚至连时间控件都有,但仍旧满足不了我 ...
- 图片-定义select向下箭头样式
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- input输入样式,动画
模板描述:input输入样式 动画,有输入框也有搜索框的样式,多种多样,大家根据自己的喜欢来. 找网站SEO教程,网站模板,以及想要建立个人博客的朋友来涂志海个人博客网,这里有你想要的一切(万一没有的 ...
- iScroll滚动区域中select、input、textarea元素无法点击的Bug修复
最近在一个项目中使用了iScroll4模拟滚动效果,调试过程中发现一个表单页中的所有表单项都无法点击聚焦, 如<select>.<input>.<textarea> ...
- Input框去掉蓝色边框
Input框去掉蓝色边框: <input type="text" name="" value="" class="Inpt& ...
- struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input
原文地址:struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input jsp页面 1 function dosearch() {2 if ($(&q ...
- 自定义input file样式
自定义input file样式:一般都是通过隐藏input,通过定义label来实现.这种做法要注意的是label的for属性要指定input对应的id; <!DOCTYPE html> ...
随机推荐
- [常用工具] 基于psutil和GPUtil获取系统状态信息
本文主要介绍在Python3中利用psutil库获取系统状态,利用GPUtil获取gpu状态. psutil (process and system utilities)(进程和系统实用程序)是一个跨 ...
- 最大公约数gcd和最小公倍数lcm
迭代版本 int gcd(int a, int b) { while (b != 0) { int r = a % b; a = b; b = r; } return a; } int lcm(int ...
- 揭开华为云CodeArts TestPlan启发式测试设计神秘面纱!
摘要:质量是产品的生死线. 本文分享自华为云社区<揭开华为云CodeArts TestPlan启发式测试设计神秘面纱!>,作者:华为云PaaS服务小智 . 2019年12月20日,是美国波 ...
- MySQL 索引的创建、删除
MySQL中索引的创建有三种方法,索引的删除有两种方法. 一.创建索引 (1)使用create index # 1.创建普通索引 create index 索引名 on 表名 (列名[(限制索引长度) ...
- Python3+Selenium3自动化测试-(六)
这里来说一说selenium中的等待方式,其实在webdriver只有两种类型等待方式,显式等待和隐式等待,之前是在程序运行过程中使用time模块中的sleep进行代码的休眠进行强制等待,是显式等待中 ...
- 下一代编解码技术Ali266在视频超高清领域的应用展望
超高清与各领域的需求融合和创新正在发生. 2022年是一个体育大年,众多世界级体育赛事通过视频直播.转播等形式给观众带来畅爽的观看体验. 2022年北京冬奥会,实现了奥运会历史上首次赛事全程4K制作播 ...
- Unity_UIWidgets - 组件Container
Unity_UIWidgets - 组件Container Container 构造 效果 结语 QQ 今日无推荐 Unity_UIWidgets - 组件Container 上周给大家讲完了Scaf ...
- linux/windows解决/关闭端口占用
Linux 找到占用端口的进程信息: netstat -lnp|grep 端口号 例如:netstat -lnp|grep 8080 就是找到正在使用8080端口的进程 关闭进程: kill -9 进 ...
- 使用 LoRA 进行 Stable Diffusion 的高效参数微调
LoRA: Low-Rank Adaptation of Large Language Models 是微软研究员引入的一项新技术,主要用于处理大模型微调的问题.目前超过数十亿以上参数的具有强能力的大 ...
- 看完这篇你不能再说不懂SSO原理了!
这一篇是原理篇,接下来还会有一篇实战篇,实战的相关代码是非常火的一个开源项目叫:xxl-sso 一.简介 单点登录(Single Sign On),简称为 SSO. 它的解释是在多个应用系统中,用户只 ...