검색창 입력공간은 이미지로 되어있다.
물론 사이즈 변경도 해줘야 하지만 입력공간의 테두리쳐진 부분은 ../images/white/bgSearchOn.gif 와 같은 이미지이다.

아래 소스는 zbxe/layouts/xe_official/css/white.css 파일에서 내가 수정해서 사용하는

#isSearch { position:absolute; top:55px; right:10px; width:248px; text-align:right;}
#isSearch .searchOrder { display:none;}
#isSearch .checked { position:absolute; left:0; top:0; text-align:left; display:block; padding:5px 0 0 5px; width:64px; height:14px; background:url(../images/white/bgSearchTerm.gif) no-repeat; font:11px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; color:#5c5c5c; line-height:normal;}
#isSearch ul { display:none; position:absolute; left:0; top:18px; padding:2px 0 3px 0; text-align:left; border:1px solid #b2b2b2; background:#ffffff; overflow:hidden;}
#isSearch ul li { width:67px; height:18px; list-style:none;}
#isSearch ul li input { display:none;}
#isSearch ul li label { display:block; padding:4px 0 0 4px; width:63px; height:15px; font:11px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; color:#5c5c5c;}
#isSearch ul li label.on { background:#ededed; }
#isSearch ul li label:hover,
#isSearch ul li label:focus { background:#ededed;}
#isSearch .inputText { vertical-align:middle; _position:relative; _top:-1px; padding:3px 0px 1px 0px; width:130px; height:15px; color:#5c5c5c; border:none; background:url(../images/white/bgSearch.gif) no-repeat;}
#isSearch .inputText:hover,
#isSearch .inputText:focus { background:url(../images/white/bgSearchOn.gif) no-repeat;}
*:first-child+html #isSearch .inputText { position:relative; top:-1px;}
#isSearch .submit { vertical-align:middle; _position:relative; _top:-1px;}
*:first-child+html #isSearch .submit { position:relative; top:-1px;}

그리고 첨부파일에 검은색 검색버튼과 폭이 130px인 검색배경을 같이 올려 둠.

필요하신 분들은 다운 받아 사용하시면 되겠네요.

이번팁도 시간절약차원의 팁..

소스 찾고 이해하려면 그래도 1분은 걸릴테니..그거라도 아껴야죠.ㅋㅋ