묻고답하기
검색창 부분 수정 하려고 하는데요....
2010.06.30 15:54
css로 네모 박스 되있는데요
/* Search */
#isSearch {position:absolute; top:32px; left:256px; padding:0;}
#isSearch .inputText {width:308px; height:16px; margin:0; padding:7px; border:3px solid #4e64f8; background:#fff; color:#333;}
#isSearch .inputText:hover,
#isSearch .inputText:focus {background:#fff;}
#isSearch .submit {position:absolute; top:0; right:-52px;}
* html #isSearch .submit {top:1px;}
*+html #isSearch .submit {top:1px;}
저걸 제가 만든 이미지로 대체 하고 싶어서요...
혹시 아시는분 답변좀 주셨으면 해요
css 도저히...모르겠어요....
댓글 3
-
똘똘이1m
2010.06.30 16:21
-
html코드도 같이... css만으로는 의도하시리려는 의미를 모르겠네요..
-
<style>
/* Search */
#isSearch {position:absolute; top:32px; left:256px; padding:0;}
#isSearch .inputText {width:308px; height:16px; margin:0; padding:7px; border:0px solid #4e64f8;background-image:url(images/pic_1.jpg) }
#isSearch .inputText:hover,
#isSearch .inputText:focus {background:#fff;}
#isSearch .submit {position:absolute; top:0; right:-52px;}
* html #isSearch .submit {top:1px;}
*+html #isSearch .submit {top:1px;}
</style>
</head><body>
<div id="isSearch"><span class="inputText">이것은 테스트이지요...ㅋㅋㅋㅋ룰라랄라 테스트</span></div>
</body></html>
보더를 0으로 넣으면 박스가 사라지고.. 위와같이 백그라운드 이미지를 넣으면border:0px solid #4e64f8;background-image:url(images/pic_1.jpg)undefined
이미지가 들어가게 됩니다..undefined대신 no-repeat를 넣으면 그림이 반복되지 않고요...
승인버튼을 이미지로 바꾸고 싶으면...
#isSearch .submit {position:absolute; top:0; right:-52px; background: url(button_image.gif) no-repeat; wudth:버튼가로크기 px; height: 버튼세로크기px;}
요런식으로 하면.. 브라우져에서 제공되는 버튼은 사라지고 이미지로 대체됩니다..
단 html에서 승인버튼을
<input name="sub_button" type=submit class="submit"> 요런식으로 주어야 겠죠...
도움이 되었다면 좋겠네요
버튼부분인가요..?
음.. 버튼을 자신이 제작한 이미지로 대체하고싶다는 뜻이 맞다면 이렇게하시는게 좋습니다
<input type="submit" value="검색">
대충 이런식으로 되어있다면, 여기에 타입이 submit 이라고 되어있는걸 image 라고 수정하시고 끝에 src="이미지주소" 를쓰시고 value="검색"은 지우시면 됩니다
예를들어
<input type="image" src="이미지주소">
이렇게하시면 버튼대신 이미지가 대체되어 있을겁니다
도움이되셧기를..