테스트 사이트 - 개발 중인 베타 버전입니다

허접팁~ 관리자화면 스타일을 메인상단에 적용하기

· 12년 전 · 7360 · 9
팁이라고 하기엔 좀 그렇지만..

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 파일에서 상단오른쪽 메뉴부분의 이미지를 주석처리합니다.

제가 실력이 되면 이미지도 편집해서 첨부하겠지만 잘안되네요ㅠ



여기까지 허접팁이었습니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 9개

12년 전
아이쿠~ 무슨 겸손의 말씀을.. 이 것도 각자 찾을려면 노가다요 잠시 머리에 쥐가 날수도 있는 것을 일러주시니 감사할 뿐입니다.
감사합니다~^^
12년 전
좋은 팁이네요.
관리자 모드는 일반 페이지보다 20px 더 넓습니다. 이것만 맞춰 준다면 퍼펙트 팁이 되겠네요. ^^
감사합니다~^^
퍼펙트팁이 되기 위해 추가로 적어놓을게요~(수정이 안되네요ㅎ)

#gnb_ul {margin:0 auto;padding:0;width:1000px;zoom:1}
이 부분에서 width값을 980px; 로 변경하면 됩니다~
오~ 4.0b3 업글 하면서 고쳐 놓으것 덮어씌워서.. 좌절했는뎅..
ㅎㅎ 요기 팁이 있었네요 넘 감사합니다..^^

하단도 상단과 비슷한 분위기로 바꾸려면 우찌해야 하나요? ㅎㅎ
저도 업글하면서 다 날렸다가 여기 링크걸어놓은거 생각나서 이글보고 다시 수정했어요~ㅎ
하단도 상단과 비슷한 분위기 는 어떤걸 말씀하시는건지 모르겠네요
색감쪽은 저와 거리가 멀어서ㅠ
아..하단에도 배경이미지로 처리 했으면 해서요..^^ 감사합니다 ㅎㅎ
12년 전
감사합니다.~~

게시글 목록

번호 제목
926
923
920
910
907
896
895
894
872
870
866
864
859
857
854
851
849
845
839
837
832
831
821
819
811
809
801
791
783
776