CSS приклад: Псевдоэлемент ::-ms-clear

Internet ExplorerChromeOperaSafariFirefoxAndroidiOS
10.0+

Версії CSS

CSS 1CSS 2CSS 2.1CSS 3

Опис

Задає стиль кнопки для очищення текстового поля. Ця кнопка спочатку не видна, вона з'являється у правій частині поля лише при введенні тексту.

Синтаксис

селектор::-ms-clear { ... }

Значення

Немає.

Приклад

HTML5CSS3IE 10CrOpSaFx

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>::-ms-clear</title>
  <style>
   #find {
    background: #fc0;
    padding: 3px;
   }
   #find::-ms-clear {
    background: #333;
    color: #fff;
   }
   #find::-ms-clear:hover {
    background: #c00;
   }
  </style>
 </head>
 <body>
  <form action="handler.php">
   <input name="q" id="find">
   <input type="submit" value="Пошук">
  </form>
 </body>
</html>

Результат цього прикладу показаний на рис. 1. При наведенні курсора миші на кнопку закриття у неї змінюється колір фону.

Рис. 1. Використання ::-ms-clear

Часті запитання

  • Q: Як використовувати псевдоелемент ::-ms-clear в CSS?

    A: Псевдоелемент ::-ms-clear використовується для стилізації 'X' кнопки очищення в полі вводу у браузері Internet Explorer.

  • Q: Де використовують псевдоелемент ::-ms-clear в CSS?

    A: Псевдоелемент ::-ms-clear використовується в CSS для полів вводу типу text у браузері Internet Explorer.

  • Q: Чи підтримують інші браузери псевдоелемент ::-ms-clear у CSS?

    A: Псевдоелемент ::-ms-clear специфічний для браузера Internet Explorer і не підтримується в інших браузерах.

  • Q: Як забрати стандартну 'X' кнопку очищення з поля вводу у браузері Internet Explorer?

    A: Можна використати псевдоелемент ::-ms-clear з властивістю display: none; для того, щоб сховати стандартну 'X' кнопку очищення.

  • Q: Які ще альтернативні способи приховати кнопку очищення в полі вводу в браузері Internet Explorer?

    A: Один із способів - використання JavaScript для видалення кнопки очищення або зміни стилів за допомогою JavaScript.