HTML 버튼 / 제출의 전체 스타일 제거

HTML 버튼 / 제출의 전체 스타일 제거

---

Internet Explorer에서 버튼의 스타일을 완전히 제거하는 방법이 있습니까? 버튼에 CSS 스프라이트를 사용했는데 모든 것이 괜찮아 보입니다.

하지만 버튼을 클릭하면 조금 위로 이동하여 모양이 엉망이됩니다. CSS 클릭 상태 또는 mousedown이 있습니까? 나는 그 상태를 유발하는 것이 무엇인지 모릅니다.

나는 그것이 정말로 큰 문제가 아니라는 것을 알고 있지만 때로는 중요한 것이 작은 것입니다.

---

나는 당신이 ' 버튼을 클릭하면 약간 위로 이동 '이라고 말하면 버튼 의 마우스 다운 클릭 상태에 대해 이야기하고 마우스 클릭을 놓으면 정상 상태로 돌아 간다고 가정합니다 ? 그리고 다음을 사용하여 버튼의 기본 렌더링을 비활성화합니다.

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

button {
  all: unset;
}

<button>check it out</button>

---

버튼에서 테두리를 제거해보세요.

input, button, submit
{
  border:none;
}

---

부트 스트랩 4에서는 가장 쉽습니다. 당신은 클래스를 사용할 수 있습니다 bg-transparent및border-0

---

버튼 "활성"상태라고 생각합니다.

참고 URL : https://stackoverflow.com/questions/2460100/remove-the-complete-styling-of-an-html-button-submit