input[type=search]::-webkit-search-cancel-button{
 -webkit-appearance: none; // 此處只是去掉默認的小×
}

自定義樣式

input[type=search]::-webkit-search-cancel-button{
 -webkit-appearance: none;
 position: relative;
 height: 20px;
 width: 20px;
 border-radius: 50%;
 background-color: #EBEBEB;
}
input[type=search]::-webkit-search-cancel-button:after{
 position: absolute;
 content: 'x';
 left: 25%;
 top: -12%;
 font-size: 20px;
 color: #fff;
}

公告

閱讀更多 web秀 的文章

關鍵字: jQuery WebKit 編程語言