userChrome.css 로 탭 모양 변경하기

Firefox의 userChrome.css를 사용해서 탭 모양을 아래와 같이 변경한다.

• 탭 최소 너비를 32px로 고정. 스크롤 없이 많은 탭을 표시할 수 있음
• 읽지 않은 탭은 굵은 이탤릭 글자로 표시
• unload 된 탭은 이탤릭 + 밑줄 표시. 탭 자체도 반투명하게 처리

방법은 아래와 같다.

1. 주소 표시줄에서 about:support 입력
2. 프로필 폴더의 폴더 열기 버튼 클릭
3. 프로필 폴더가 열리면 chrome 폴더 생성
4. chrome 폴더 안에 userChrome.css 파일 생성
   

   @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
   
   .tabbrowser-tab {
       min-width: 32px !important;
   }
   
   .tab-content {
       overflow:hidden !important;
   }
   
   .tabbrowser-tab:not([pinned]):not([fadein]) {
       visibility: collapse !important;
   }
   
   .tabbrowser-tab[unread]:not([selected="true"]) {
       font-weight: bold !important;
       font-style: italic !important;
   }
   
   .tabbrowser-tab[unread]:not([selected="true"]) .tab-text {
       opacity: 0.75 !important;
   }
   
   .tabbrowser-tab[pending] {
       opacity: 0.6 !important;
       font-style: italic !important;
   }
   
   .tabbrowser-tab[pending] .tab-text{
       text-decoration: underline dashed !important;
   }

5. Firefox 재시작