HTML 참조 매뉴얼

HTML 태그 전체 목록

HTML: <button> 태그

HTML <button> 태그는 클릭할 수 있는 버튼을 나타내는 요소로, 양식이나 문서의 다른 필요한 간단한 표준 버튼 위치에 사용할 수 있습니다. 이 태그는 일반적으로 <button> 요소라고도 합니다.

온라인 예제

다음 코드는 버튼을 표시합니다：

예제

!DOCTYPE　html>
<html>
<head>　
<meta　charset="utf-8">　
<title>기본 튜토리얼(oldtoolbag.com)</title>　
</head>　
<body>
<button　type="button"　onclick="alert('안녕하세요, 세상!')">클릭하세요</button>
　
</body>
</html>

테스트해보세요 ‹/›

브라우저 호환성

IEFirefoxOperaChromeSafari

모든 주요 브라우저가 <button> 태그를 지원합니다.

태그 정의 및 사용 설명

버튼 태그는 버튼을 정의합니다.

<button> 요소 내에서, 텍스트나 이미지와 같은 내용을 배치할 수 있습니다. 이는 이 요소가 <input> 요소로 만들어진 버튼과의 차이점입니다.

HTML <button> 요소는 <body> 태그 내에 위치합니다.
<button> 태그는 <a> 태그의 뒤에 위치할 수 없습니다.

추천：다WAYS로 <button> 요소에 type 속성을 지정해야 합니다. 다른 브라우저는 <button> 요소의 type 속성에 대해 다른 기본 값을 사용합니다.

고지 및 주의

주의사항：HTML 표单에서 <button> 요소를 사용할 때, 다른 브라우저는 다른 버튼 값을 제출할 수 있습니다. 다음을 사용하여 <input> HTML 표单에서 버튼을 생성합니다.

HTML 4.01 와 HTML5간의 차이

HTML5 에 새로운 속성：autofocus、form、formaction、formenctype、formmethod、formnovalidate 및 formtarget.

속성

New　：HTML5 에 새로운 속성.

속성	값	설명
autofocusHTML5	autofocus	페이지가 로드될 때 버튼이 자동으로 포커스를 받도록 정의합니다.
disabled	disabled	이 버튼을 비활성화하도록 정의합니다.
formHTML5	form_id	버튼이 하나 또는 여러 개의 form에 속하는지 정의합니다.
formactionHTML5	URL	form을 제출할 때 어떻게 데이터를 보내야 하는지 정의합니다. form 요소의 action 속성을 덮어쓰습니다. 이 속성은 type="submit"와 함께 사용됩니다.
formenctypeHTML5	application/x-www-form-urlencoded multipart/form-data text/plain	form 데이터를 서버로 전송할 때 사용할 HTTP 메서드를 정의합니다. form 요소의 method 속성을 덮어쓰습니다. 이 속성은 type="submit"와 함께 사용됩니다.
formmethodHTML5	get post	form 데이터를 서버로 전송하기 전에 어떻게 인코딩할지 정의합니다. form 요소의 enctype 속성을 덮어쓰습니다. 이 속성은 type="submit"와 함께 사용됩니다.
formnovalidateHTML5	formnovalidate	이 속성을 사용하면, form을 제출할 때 검증을 하지 않습니다. form 요소의 novalidate 속성을 덮어쓰습니다. 이 속성은 type="submit"와 함께 사용됩니다.
formtargetHTML5	_blank _self _parent _top framename	action URL을 어디서 열어야 하는지 정의합니다. form 요소의 target 속성을 덮어쓰습니다. 이 속성은 type="submit"와 함께 사용됩니다. 양식을 제출한 후에 응답을 표시할 위치를 나타내는 이름이나 키워드를 지정합니다.다음 중 하나의 값이 될 수 있습니다: _self, _blank, _parent, _top _self-현재 프레임워크나 컨텍스트에 로드되도록 합니다 _blank-새 창이나 컨텍스트에 로드되도록 합니다 _parent-부모 프레임워크나 컨텍스트에 로드되도록 합니다 _top-콘텐츠가 완전히 로드된 원래 창에 로드되도록 합니다
name	name	버튼의 이름을 정의합니다.
type	submit　 reset button	버튼의 타입을 정의합니다. 제출-서버로 테이블 데이터를 제출하도록 만듭니다. 타입이 지정되지 않았을 경우 기본 값이 사용됩니다 초기화-모든 컨트롤을 초기화하도록 만듭니다 버튼-이 버튼이 기본 동작이 없음을 나타냅니다
value	text	버튼의 초기 값을 정의합니다. 스크립트에서 수정할 수 있습니다.

전반적인 속성

<button> 태그가 지원 HTML의 전반적인 속성。

이벤트 속성

<button> 태그가 지원 HTML의 이벤트 속성。