KnP House for Daily

[html] 이미지 버튼 만들기!! 본문

Web/Html,CSS

[html] 이미지 버튼 만들기!!

K.ung 2014.02.10 07:08

//////////////////////////////////////////////////////////////////////////////


<button class="btn" id="btn" type="submit"><img class="btn-img" src=""></button>


//////////////////////////////////////////////////////////////////////////////


html 에서 기본 버튼이 아니라 이미지로 된 버튼을 만들어보쟈.


몇가지 방법이 있는데, 가장 이미지버튼 다운건 <button> tag를 이용해서,  


자식 tag에 <img>를 삽입하는 방식 인것 같다.


위 소스 처럼 하면 되고,  css style에 border를 없애고, background-color 를 흰바탕으로 하게 되면 


순수 이미지만 나오게 되고, 버튼 클릭 효과 도 나와서 보기 좋은것 같다.


대신 <img>태그를 한칸아래로 내려서 쓰면 안됀다!! 주의 하자

저작자 표시 비영리 변경 금지
신고
0 Comments
댓글쓰기 폼