허접팁~ 관리자화면 스타일을 메인상단에 적용하기 정보
허접팁~ 관리자화면 스타일을 메인상단에 적용하기관련링크
http://playi.kr/g4s/
413회 연결
본문
팁이라고 하기엔 좀 그렇지만..
1. css/default.css 에서
#hd {height:73px;border-top:3px solid #151515;border-bottom:1px solid #e7f1ed;background:#fff} 부분을
#hd {height:70px; background:url('../adm/img/hd_bg.jpg') repeat-x}
로 변경
2. default.css 파일에서
/* gnb js off */ /* gnb js on */ 부분을
css/admin.css 파일의 메뉴스타일로 바꾸면 됩니다.
(아이디,클래스 동일합니다.)
/* gnb js off */
#gnb {z-index:10;background:#383a3f}
#gnb h2 {margin:0;padding:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#gnb_ul {margin:0 auto;padding:0;width:1000px;zoom:1}
#gnb_ul:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_1depth {z-index:10;clear:both;zoom:1}
.gnb_1depth:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_1depth a {display:block;float:left;width:80px;height:35px;color:#e0e0e0;font-weight:bold;line-height:2.95em;text-decoration:none}
.gnb_1depth a:focus,
.gnb_1depth a:hover {text-decoration:none}
.gnb_sub_ul {float:left;width:auto}
.gnb_2depth {float:left}
.gnb_2depth a {color:#e0e0e0;font-weight:normal}
/* gnb js on */
.gnb_js {padding-left:1px}
.gnb_js #gnb_ul {zoom:1}
.gnb_js #gnb_ul:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_js .gnb_1depth {clear:none;position:relative;float:left;margin:0 0 0 -1px;border:1px solid #222;border-top:0;border-bottom:0}
.gnb_js .gnb_1depth a {color:#fff;text-align:center}
.gnb_js .gnb_1depth_air a {float:none;background:#f7f7f2;color:#000}
.gnb_js .gnb_1depth_on a {float:none;background:#fff;color:#000}
.gnb_js .gnb_sub_ul {position:absolute;top:35px;width:1px;height:1px;overflow:hidden}
.gnb_js .gnb_2depth a {display:inline-block;float:none !important;padding:0 10px;width:161px;text-align:left}
.gnb_1depth_over .gnb_sub_ul {left:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff}
.gnb_1depth_over2 .gnb_sub_ul {right:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff}
3. 오른쪽 상단메뉴부분
#mb_nb a {display:block;padding:5px 10px;color:#333;letter-spacing:-0.1em}
이부분의 color를 #fff 로 바꾸면 됩니다.
그리고 head.php 파일에서 상단오른쪽 메뉴부분의 이미지를 주석처리합니다.
제가 실력이 되면 이미지도 편집해서 첨부하겠지만 잘안되네요ㅠ
여기까지 허접팁이었습니다.
1. css/default.css 에서
#hd {height:73px;border-top:3px solid #151515;border-bottom:1px solid #e7f1ed;background:#fff} 부분을
#hd {height:70px; background:url('../adm/img/hd_bg.jpg') repeat-x}
로 변경
2. default.css 파일에서
/* gnb js off */ /* gnb js on */ 부분을
css/admin.css 파일의 메뉴스타일로 바꾸면 됩니다.
(아이디,클래스 동일합니다.)
/* gnb js off */
#gnb {z-index:10;background:#383a3f}
#gnb h2 {margin:0;padding:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#gnb_ul {margin:0 auto;padding:0;width:1000px;zoom:1}
#gnb_ul:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_1depth {z-index:10;clear:both;zoom:1}
.gnb_1depth:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_1depth a {display:block;float:left;width:80px;height:35px;color:#e0e0e0;font-weight:bold;line-height:2.95em;text-decoration:none}
.gnb_1depth a:focus,
.gnb_1depth a:hover {text-decoration:none}
.gnb_sub_ul {float:left;width:auto}
.gnb_2depth {float:left}
.gnb_2depth a {color:#e0e0e0;font-weight:normal}
/* gnb js on */
.gnb_js {padding-left:1px}
.gnb_js #gnb_ul {zoom:1}
.gnb_js #gnb_ul:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_js .gnb_1depth {clear:none;position:relative;float:left;margin:0 0 0 -1px;border:1px solid #222;border-top:0;border-bottom:0}
.gnb_js .gnb_1depth a {color:#fff;text-align:center}
.gnb_js .gnb_1depth_air a {float:none;background:#f7f7f2;color:#000}
.gnb_js .gnb_1depth_on a {float:none;background:#fff;color:#000}
.gnb_js .gnb_sub_ul {position:absolute;top:35px;width:1px;height:1px;overflow:hidden}
.gnb_js .gnb_2depth a {display:inline-block;float:none !important;padding:0 10px;width:161px;text-align:left}
.gnb_1depth_over .gnb_sub_ul {left:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff}
.gnb_1depth_over2 .gnb_sub_ul {right:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff}
3. 오른쪽 상단메뉴부분
#mb_nb a {display:block;padding:5px 10px;color:#333;letter-spacing:-0.1em}
이부분의 color를 #fff 로 바꾸면 됩니다.
그리고 head.php 파일에서 상단오른쪽 메뉴부분의 이미지를 주석처리합니다.
제가 실력이 되면 이미지도 편집해서 첨부하겠지만 잘안되네요ㅠ
여기까지 허접팁이었습니다.
추천
1
1
댓글 9개
아이쿠~ 무슨 겸손의 말씀을.. 이 것도 각자 찾을려면 노가다요 잠시 머리에 쥐가 날수도 있는 것을 일러주시니 감사할 뿐입니다.
감사합니다~^^
좋은 팁이네요.
관리자 모드는 일반 페이지보다 20px 더 넓습니다. 이것만 맞춰 준다면 퍼펙트 팁이 되겠네요. ^^
관리자 모드는 일반 페이지보다 20px 더 넓습니다. 이것만 맞춰 준다면 퍼펙트 팁이 되겠네요. ^^
감사합니다~^^
퍼펙트팁이 되기 위해 추가로 적어놓을게요~(수정이 안되네요ㅎ)
#gnb_ul {margin:0 auto;padding:0;width:1000px;zoom:1}
이 부분에서 width값을 980px; 로 변경하면 됩니다~
#gnb_ul {margin:0 auto;padding:0;width:1000px;zoom:1}
이 부분에서 width값을 980px; 로 변경하면 됩니다~
오~ 4.0b3 업글 하면서 고쳐 놓으것 덮어씌워서.. 좌절했는뎅..
ㅎㅎ 요기 팁이 있었네요 넘 감사합니다..^^
하단도 상단과 비슷한 분위기로 바꾸려면 우찌해야 하나요? ㅎㅎ
ㅎㅎ 요기 팁이 있었네요 넘 감사합니다..^^
하단도 상단과 비슷한 분위기로 바꾸려면 우찌해야 하나요? ㅎㅎ
저도 업글하면서 다 날렸다가 여기 링크걸어놓은거 생각나서 이글보고 다시 수정했어요~ㅎ
하단도 상단과 비슷한 분위기 는 어떤걸 말씀하시는건지 모르겠네요
색감쪽은 저와 거리가 멀어서ㅠ
하단도 상단과 비슷한 분위기 는 어떤걸 말씀하시는건지 모르겠네요
색감쪽은 저와 거리가 멀어서ㅠ
아..하단에도 배경이미지로 처리 했으면 해서요..^^ 감사합니다 ㅎㅎ
감사합니다.~~