Видаліть повний стиль кнопки / подати HTML

Чи є спосіб повністю видалити стиль кнопки в Internet Explorer? Я використовую спрайт css для своєї кнопки, і все виглядає нормально.

Але коли я натискаю кнопку, вона трохи рухається до верху, і це виглядає нестандартно. Чи існує стан css-клацання або миша? Я не знаю, що викликає цей стан.

Я знаю, що це не дуже велика справа, але іноді важливі дрібниці.

Я припускаю, що коли ви говорите " натисніть кнопку, вона трохи переміститься вгору ", ви говорите про стан клацання миші для кнопки, і що коли ви відпускаєте клацання миші, вона повертається до свого нормального стану ? І що ви відключаєте рендеринг кнопки за замовчуванням, використовуючи:

input, button, submit { border:none; } 

Якщо так..

Особисто я виявив, що ви насправді не можете зупинити / перевизначити / відключити цю власну дію IE, що змусило мене трохи змінити розмітку, щоб дозволити цей рух і не впливати на загальний вигляд кнопки для різних станів.

Це моя остаточна націнка:

<span class="your-button-class">
    <span>
        <input type="Submit" value="View Person">
    </span>
</span>

Я думаю, що це забезпечує більш ретельний підхід:

button, input[type="submit"], input[type="reset"] {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}

<button>Example</button>

На вашому запитанні написано "Internet Explorer", але для тих, хто цікавиться іншими браузерами, тепер ви можете скористатися ним all: unset кнопки для стилізації.

Це не працює в IE або Edge 18, але добре підтримується скрізь.

https://caniuse.com/#feat=css-all

Попередження про кольори Safari: встановлення тексту colorкнопки після використання all: unsetможе не вдатися в Safari 13.1 через помилку в WebKit . (Помилка буде виправлена ​​в Safari 14 і новіших версіях.) " all: unsetВстановлено -webkit-text-fill-colorчорний, і це замінює колір". Якщо вам потрібно встановити текст colorпісля використання all: unset, обов’язково встановіть один colorі -webkit-text-fill-colorтой же колір.

Попередження про доступність: Для користувачів, які не використовують вказівник миші, не забудьте повторно додати якийсь :focusстиль, наприклад button:focus { outline: orange auto 5px }для доступності клавіатури .

І не забувайте cursor: pointer. all: unsetвидаляє всі стилі, включаючи cursor: pointer, що робить курсор миші схожим на вказівну руку, коли ви наводите курсор на кнопку. Ви майже напевно хочете повернути це назад.

button {
  all: unset;
  color: blue;
  -webkit-text-fill-color: blue;
  cursor: pointer;
}

button:focus {
  outline: orange 5px auto;
}

<button>check it out</button>

Спробуйте видалити межу з кнопки:

input, button, submit
{
  border:none;
}

У bootstrap 4 це найпростіше. Ви можете використовувати класи: bg-transparentіborder-0

Я думаю, що це кнопка "активний" стан.