在vue组件的stylus样式中 取消search类型的input按钮中默认样式

记录一个坑

环境

  • Vue组件
  • 使用了Stylus的CSS风格.

问题

  • input输入框使用了 type="search"这种类型
  • 使用后发现, 输入内容后, 最后用个取消按钮,极其恶心, 见截图

解决

  • 在input类型, 有提供针对此类型的伪元素, 可以进行隐藏

总结

  • 开始时, 总结在input后面添加伪元素, 是无效的
  • 不清楚, 此问题原因, 有大神讲与伪元素的继承有关.
  • 看来, 应该总结下这一块了

伪元素继承问题

待完成

在vue组件的stylus样式总 取消search类型的input按钮中默认样式的更多相关文章

  1. input按钮去掉默认样式

    border: 1px solid transparent; //自定义边框 outline: none; //消除默认点击蓝色边框效果

  2. 移动端去掉按钮button默认样式

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  3. 【转】html5中如何去掉input type date默认样式

    html5中如何去掉input type date默认样式1.时间选择的种类:HTML代码: 选择日期:<input type="date" value="2017 ...

  4. html5中如何去掉input type date默认样式

    html5中如何去掉input type date默认样式 1.时间选择的种类: HTML代码: 选择日期:<input type="date" value="20 ...

  5. iOS中默认样式修改－b

    项目中有大量的UITableView都需要显示sectionHeader.iOS中默认sessionHeader上的textLabel样式跟设计图不符. 按照我们之前的解决方案,是在每个UITable ...

  6. input时间表单默认样式修改（input[type="date"]）

    一.时间选择的种类: HTML代码:选择日期:<input type="date" value="2018-11-15" /> 选择时间:<i ...

  7. css修改input表单默认样式重置与自定义大全

    链接地址: 伪元素表单控件默认样式重置与自定义大全 http://www.zhangxinxu.com/wordpress/?p=3381 Chrome 现在不支持通过伪元素修改 meter 元素样式 ...

  8. input框改变默认样式

      input[type="radio"] { width: 2rem; height: 2rem; -webkit-appearance: none; /*清除复选框默认样式*/ ...

  9. input选择框默认样式修改

    input选择框是无法直接修改样式,我们只能间接来改变它样式. 原理:用图片来代替原来的input选择框,原来的input选择框定位到图片上方并让它opacity为0,鼠标点击时用js来改变图片,这样 ...

随机推荐

  1. 嵌入式开发之davinci--- 8168 question about capture PAL on 8168

    http://e2e.ti.com/support/dsp/davinci_digital_media_processors/f/717/t/340483.aspx?pi199607=2

  2. debian old version cd and distribution archives

    1 debian old version cd/dvd 官网的old version image,下载速度很慢 http://cdimage.debian.org/cdimage 下面这个靠谱,是镜像 ...

  3. NBUT 1222 English Game（trie树+DP）

    [1222] English Game 时间限制: 1000 ms 内存限制: 131072 K 问题描写叙述 This English game is a simple English words ...

  4. 您可能试图从server上的安全浏览器訪问此站点。请启用脚本然后又一次载入此页。

    您可能试图从server上的安全浏览器訪问此站点.请启用脚本然后又一次载入此页.         我使用域Admin组的账户登入SharePoint2010的server,打开SharePoint首页 ...

  5. PR修改例子

    DATA: lt_items_old    LIKE TABLE OF bapiebanv   WITH HEADER LINE.   DATA: lt_items_new    LIKE TABLE ...

  6. 搭建双系统后没有windows的引导程序

    因为安装linux系统前没有安装引导程序,导致安装了linux系统后进入linux系统没有windows的引导程序,网上找了很多解决办法,也不能说是不好使,只是作为新手小白来说有点难以理解,最后无意中 ...

  7. nodejs 实战

    使用 Koa + MongoDB + Redis 搭建论坛系统 「新手向」koa2从起步到填坑 基于koa2和react的PC端脚手架 一键生成koa/koa2项目: nodejs原生,express ...

  8. MYSQL学习拓展一：MySQL 存储过程之游标的使用！

    一.MySQL游标的概念 游标介绍: MySQL的游标(cursor)是一个重要的概念,通过查找资料与自己的理解,主要得出以下几点关于自己的理解. 有数据缓冲的思想:游标的设计是一种数据缓冲区的思想, ...

  9. .NET 的 WebSocket 开发包比较 【已翻译100%】--网址：http://www.oschina.net/translate/websocket-libraries-comparison-2

    编者按 本文出现在第三方产品评论部分中.在这一部分的文章只提供给会员,不允许工具供应商用来以任何方式和形式来促销或宣传产品.请会员报告任何垃圾信息或广告. Web项目常常需要将数据尽可能快地推送给客户 ...

  10. 深入理解WeakHashmap

    转自:http://mikewang.blog.51cto.com/3826268/880775 (一) 查看API文档,WeakHashmap要点如下: 1. 以弱键 实现的基于哈希表的 Map.在 ...