时间戳

首页 > 解决方案 > 如何去掉搜索栏上的“X”

css - 如何去掉搜索栏上的“X”

问题描述

我试图摆脱在搜索栏中写东西时出现的“X”按钮，或者至少改变它：

<input type="search">

我尝试了以下 CSS：

input[type="search"]{-webkit-appearance: none;}

还有一些没有用的 webkit 东西。

标签： css

解决方案

我尝试在 Google 上搜索input type text remove close. 我得到了这个结果。您可以使用以下代码在 Chrome 或 Internet Explorer 上将其删除。

/* clears the 'X' from Internet Explorer */
input[type=search]::-ms-clear {  display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal {  display: none; width : 0; height: 0; }

/* clears the 'X' from Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }
<input type="search" />

上面的代码来自：Remove the X from Internet Explorer and Chrome input type search | 马克西姆·鲁耶尔。

刚刚发现它可能是某些输入上删除 IE10 的“清除字段”X 按钮的可能重复项？

推荐阅读