버튼 요소 내부에 이미지를 올바르게 포함하려면 어떻게 해야 합니까?

<버튼>에 이미지 삽입 요소

<버튼> 내에 이미지 삽입 요소는 시각적 매력을 제공하고 사용자 상호 작용을 향상시킬 수 있습니다. 하지만 가시성을 확보하려면 이미지의 위치를 ​​올바르게 지정하는 것이 중요합니다.

제공된 HTML 코드에서 이미지는 <버튼> 안에 있습니다. 이 문제는 여백 문제로 인해 발생하며, 결과적으로 이미지가 버튼 테두리를 넘어 확장됩니다.

이 문제를 해결하려면 다음 두 가지 옵션이 있습니다.

입력 유형="이미지" 사용

<input type="image" src="icons/close.png" />

이 방법은 버튼처럼 작동하고 이벤트를 처리할 수 있는 "이미지" 유형의 입력 필드를 사용합니다. 핸들러. 이미지는 버튼으로 표시되어 버튼 테두리 내에서 정렬됩니다.

CSS 사용

<button>

또는 버튼에 CSS를 적용하여 설정을 할 수도 있습니다. 배경 이미지를 원하는 대로 설정하고 여백, 안쪽 여백 및 테두리를 조정하여 이미지가 버튼 경계 내 중앙에 오도록 합니다.

위 내용은 버튼 요소 내부에 이미지를 올바르게 포함하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!