在vue组件的stylus样式总 取消search类型的input按钮中默认样式
在vue组件的stylus样式中 取消search类型的input按钮中默认样式
记录一个坑
环境
- Vue组件
- 使用了Stylus的CSS风格.
问题
- input输入框使用了
type="search"
这种类型 - 使用后发现, 输入内容后, 最后用个取消按钮,极其恶心, 见截图
解决
- 在input类型, 有提供针对此类型的伪元素, 可以进行隐藏
总结
- 开始时, 总结在input后面添加伪元素, 是无效的
- 不清楚, 此问题原因, 有大神讲与伪元素的继承有关.
- 看来, 应该总结下这一块了
伪元素继承问题
待完成
在vue组件的stylus样式总 取消search类型的input按钮中默认样式的更多相关文章
- input按钮去掉默认样式
border: 1px solid transparent; //自定义边框 outline: none; //消除默认点击蓝色边框效果
- 移动端去掉按钮button默认样式
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- 【转】html5中如何去掉input type date默认样式
html5中如何去掉input type date默认样式1.时间选择的种类:HTML代码: 选择日期:<input type="date" value="2017 ...
- html5中如何去掉input type date默认样式
html5中如何去掉input type date默认样式 1.时间选择的种类: HTML代码: 选择日期:<input type="date" value="20 ...
- iOS中默认样式修改-b
项目中有大量的UITableView都需要显示sectionHeader.iOS中默认sessionHeader上的textLabel样式跟设计图不符. 按照我们之前的解决方案,是在每个UITable ...
- input时间表单默认样式修改(input[type="date"])
一.时间选择的种类: HTML代码:选择日期:<input type="date" value="2018-11-15" /> 选择时间:<i ...
- css修改input表单默认样式重置与自定义大全
链接地址: 伪元素表单控件默认样式重置与自定义大全 http://www.zhangxinxu.com/wordpress/?p=3381 Chrome 现在不支持通过伪元素修改 meter 元素样式 ...
- input框改变默认样式
input[type="radio"] { width: 2rem; height: 2rem; -webkit-appearance: none; /*清除复选框默认样式*/ ...
- input选择框默认样式修改
input选择框是无法直接修改样式,我们只能间接来改变它样式. 原理:用图片来代替原来的input选择框,原来的input选择框定位到图片上方并让它opacity为0,鼠标点击时用js来改变图片,这样 ...
随机推荐
- LeetCode(67)题解: Add Binary
https://leetcode.com/problems/add-binary/ 题目: Given two binary strings, return their sum (also a bin ...
- These interactions can be expressed as complicated, large scale graphs. Mining data requires a distributed data processing engine
https://databricks.com/blog/2014/08/14/mining-graph-data-with-spark-at-alibaba-taobao.html
- swt_table 回车可编辑Esc取消
package 宿舍管理系统; import java.util.Hashtable; import org.eclipse.swt.SWT; import org.eclipse.swt.custo ...
- td 中连续数字或连续英文内容不自动换行
原因: 把连续的英文当做成了一个单词. 解决: 加上 : word-break: break-all (允许单词内换行)
- 关于UISearchBar
iPhone开发之UISearchBar学习是本文要学习的内容,主要介绍了UISearchBar的使用,不多说,我们先来看详细内容.关于UISearchBar的一些问题. 1.修改UISearchBa ...
- FZU2150 Fire Game —— BFS
题目链接:https://vjudge.net/problem/FZU-2150 Problem 2150 Fire Game Accept: 2702 Submit: 9240 Time Li ...
- jdk8新特性Stream
Stream的方法描述与实例 1,filter 过滤 Person p1 = new Person(); p1.setName("P1"); p1.setAge(10); Per ...
- Linux 下WAS的java版本查看
1.查找linux的详细版本号: A.cat /proc/version B.lsb_release -a(可以查出是否为redhat开发的) C.uname -a 2.Linux的java版本 A. ...
- Swagger测试工具
http://www.360doc.com/content/16/0509/08/1355383_557462195.shtml
- I.MX6 Parallel RGB LCD Datasheet描述
/******************************************************************** * I.MX6 Parallel RGB LCD Datas ...