[HTML] <input type="button"> vs <button type="button"> 차이점

HTML에서 버튼을 만들 땐 두 가지 방법이 있습니다

바로 <input type="button"> 과 <button type="button">인데요, 둘의 차이점을 간단하게 정리해보겠습니다!

---

1️⃣ 텍스트 넣는 방법이 달라요!

• <input type="button" value="확인" />
  👉 value 속성으로 버튼 글자를 정해요
• <button type="button">확인</button>
  👉 버튼 태그 안에 글자를 직접 넣거나, 아이콘 같은 HTML 요소도 함께 넣을 수 있어요!

2️⃣ 사용 목적에 따라 골라 써요!

• <input type="button" />
  👉 단순 클릭만 필요할 때 사용하고, 구조가 단순해서 스크린 리더 등 접근성 면에서도 유리할 수 있어요
• <button type="button"></button>
  👉 버튼 안에 아이콘, 이미지 등 다양한 요소를 넣고 싶을 때 사용하고, 더 자유롭게 꾸밀 수 있습니다

📝  TIP!

✔️ 클릭만 필요한 간단한 버튼 👉 <input type="button">
✔️ 아이콘이나 스타일 다양하게 넣고 싶은 버튼 👉 <button type="button">