반응형
250x250
«   2025/01   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Notice
Recent Posts
Today
Total
관리 메뉴

네이처리 노트

[HTML] input button과 button태그 비교하기 본문

개발기록/HTML CSS

[HTML] input button과 button태그 비교하기

네이처리 2022. 8. 29. 19:50
728x90
반응형

공부하면서 정리한 내용입니다
참고한 내용은 맨 아래의 링크를 확인해주세요




input button은 스스로 닫는 태그 (열린태그)

<input type=button />


button은 스스로 닫지 않는 태그

  • 하위 요소를 추가할 수 있다.
  • 디자인 측면에서도 자유도가 더 높아진다.
<button> 
    이것을 
    <span style='color:red'> 클릭 </span> 
    해보세요 
</button>

input의 한계를 넘기 위해 나온 것이 button이다.






Reference

1) 버튼에 타입을 쓰는 이유

버튼에 타입을 쓰는 이유 (button type="button")

프롤로그 가끔 이렇게 type을 명시한 버튼을 마주칠 때가 있는데 전 항상 궁금하더라구요. "아니 버튼이면 버튼이지 버튼 타입 버튼은 대체 뭐람" 그러고보면 비슷하게 타입을 명시하는 이라는

nykim.work

2) input과 button의 공통점과 차이점

[HTML & CSS] input과 button의 공통점과 차이점

button 태그가 하는 일은 무엇일까? "어느 날 이런 일을 겪었다. form 태그 안에 form data와 관련 없는 버튼을 만든 후 그 버튼을 눌렀더니 form이 전송되었다. 응? button을 눌렀는데 왜 form이 "submit" 되지

cocoder16.tistory.com

728x90
반응형
Comments