유용한 웹 팁

뒤로가기
제목

모바일 디자인 상단 메뉴바 색상 변경하기

작성자 별모아디자인(ip:)

작성일 2022-03-30

조회 126

평점 0점  

추천 추천하기

내용

< 모바일 디자인 상단 메뉴바 색상 변경하기 >





위의 이미지에서 빨간박스 부분의 색상 변경 방법입니다.


 별모아 28번 모바일 디자인의 상단 메뉴바 색상은 현재 녹색입니다. 

다른 색상으로 수정하고싶으시면 아래 설명대로 해주세요. 

 

일단 상단 메뉴바 부분은 왼쪽의 전체 상품목록 부분과 오른쪽의 장바구니, 주문조회, 커뮤니티 로 나누어져있는데 

전체 상품목록 부분은 진한 녹색이고 장바구니, 주문조회, 커뮤니티 부분은 밝은 연두색입니다.


관리자 페이지에서 모바일 쇼핑몰 > 디자인 보관함에서 대표 디자인의 '수정' 버튼을 클릭하면 

스마트 디자인 편집창이 뜹니다. 

편집창 좌측 하단의 화면명 검색에서 layout.css 을 검색하신 후

/layout/basic/css/layout.css 에 체크 후 선택파일열기 버튼을 클릭하시면

해당 파일이 열립니다.


소스창에서 273행 근처에 보면 아래와 같은 소스가 보입니다. 

아래 소스는 전체 상품목록 부분의 소스입니다.

 



/* 전체 상품목록 */

.category_inner { 

           width:120px;

           height:34px;

           line-height:34px;

           background-color:#44aa00;

           margin: 0 auto; 

           font-size:14px;

           color:#ffffff;

           }


 


그리고 255행 근처에 보면 아래와 같은 소스가 보입니다. 

아래 소스는 장바구니, 마이쇼핑, 커뮤니티 부분의 소스입니다.

 


/* 장바구니, 마이쇼핑, 커뮤니티 */

#top_menu2 {

    margin-top:0px;

    background-color: #8bc223;

    height: 34px;

    width: 100%;

    }


 


위의 소스에서 각각 빨강색으로 표시된 부분을 원하시는 색상 코드로 각각 수정해주신 후 

스마트 디자인 편집창 상단 왼쪽의 ‘저장’ 버튼을 클릭해주시면 됩니다. 

색상 코드 수정하실 때 색상 코드 바로 뒤에 있는 ; 가 지워지지않도록 유의해주세요. 

 




첨부파일

비밀번호
수정

비밀번호 입력후 수정 혹은 삭제해주세요.

댓글목록

등록된 댓글이 없습니다.

댓글 수정

이름

비밀번호

내용

/ byte

수정 취소

비밀번호

확인 취소

댓글 입력

이름

비밀번호

내용

/ byte

평점

관리자에게만 댓글 작성 권한이 있습니다.