마크쿼리 스킨 완전정복! : 상단 드롭메뉴 배경색바꾸기, 검색창에 테두리 설정하기

안녕하세요! Dean입니다. 이번시간에는 마크쿼리 스킨에서 상단 드롭메뉴의

 배경색, 글자색, 구분선색을 바꿔보고 검색창에 테두리를 지정하는 법을 알아보겠습니다.

---

상단 드롭메뉴 변경

 스킨관리자에서 Style.css 부분에 nav ul li ul a 부분을 찾으셔서 아래부분을 참고하셔서 원하시는 색으로 설정하시면 되겠습니다.

.nav ul li ul li a {
  display:block;
  width:180px;
  padding:15px 20px;
  color:원하시는글자색코드입력;
  text-decoration:none;
  background-color:원하시는배경색코드입력;
  border-bottom:1px solid 원하시는구분선색입력;
  opacity: 0.9;
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  filter: alpha(opacity=90);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";

 Tip

구글 요소검사를 이용하시면 색을 지정해서 어울리는 색을 보면서 설정할 수 있습니다.

-상단 드롭메뉴위에서 오른쪽버튼 클릭 후 요소검사 클릭-

마우스 오버시 색깔을 바꾸시려면 .nav ul li ul li a:hover 에서 위와 똑같은 방법으로 수정하시면 됩니다.

---

검색창에 테두리 설정하기

 위 처럼 서치바 검색영역에 테두리를 설정해보겠습니다.

스킨관리자에서 Style.css 부분에 .search - input 부분을 찾으셔서 노란 배경으로 써져 있는 부분을 추가하시면 됩니다.

.search-input {
  width:100%;
  outline: none;
  padding: 3px 10px;
  margin: 5px;
  border: none;
  -webkit-border-radius: 0; 
  -moz-border-radius: 0; 
  border-radius: 0; 
  border: 1px solid #ccc; 이부분을 추가해줍니다.
}