홈페이지 » 어떻게 » Orange Firefox 메뉴 버튼의 모양을 사용자 정의하는 방법

    Orange Firefox 메뉴 버튼의 모양을 사용자 정의하는 방법

    오렌지색 Firefox 메뉴 버튼을 보면서 질려하십니까? Firefox의 인터페이스는 완전히 사용자 정의가 가능하므로 Firefox 메뉴 버튼의 색상, 텍스트 및 기타 속성을 변경하여 나만의 사용자 정의 모양을 만들 수 있습니다.

    Firefox 메뉴 버튼의 모양을 변경하려면 userChrome.css 파일을 편집합니다. 이 파일을 사용하면 Firefox의 모든 기능과 기능을 변경할 수 있습니다.

    userChrome.css 파일을 편집하기 전에 ChromEdit Plus라는 부가 기능을 설치하여 파일을 쉽게 편집하고 올바른 형식으로 저장할 수 있습니다. ChromEdit Plus 웹 페이지로 이동하려면 다음 링크를 클릭하십시오..

    http://webdesigns.ms11.net/chromeditp.html

    페이지에서 Firefox에 추가 버튼을 클릭하십시오..

    다음 메시지가 표시 될 수 있습니다. ChromEdit Plus 부가 기능 설치를 계속하려면 허용을 클릭하십시오..

    참고 : 확장 프로그램 및 기타 소프트웨어를 설치할 때 허용되는 사항에 매우주의하십시오. 제품에 대해 확실하지 않거나 회사를 신뢰하지 않는 경우 설치하지 마십시오. ChromEdit Plus를 테스트 한 결과 ChromEdit Plus는 안전하고 신뢰할 수 있음을 발견했습니다..

    소프트웨어 설치 대화 상자가 표시됩니다. 카운트 다운이 완료 될 때까지 사용할 수없는 지금 설치를 클릭하십시오..

    참고 : 설치 버튼에서 카운트 다운 길이를 변경할 수 있지만 사용을 권장하지 않습니다.

    설치를 마치려면 Firefox를 다시 시작해야합니다. 팝업 대화 상자에서 지금 다시 시작을 클릭하십시오..

    Firefox가 다시 시작되면 ChromEdit Plus 버튼이 주소 상자 오른쪽에 추가됩니다. 클릭하면 ChromEdit Plus 창이 열립니다..

    ChromEdit Plus 창에는 기본적으로 3 개의 탭이 있습니다. 첫 번째 탭에있는 userChrome.css 파일을 수정합니다. 탭이 비어 있으면 다음 텍스트를 복사하여 userChrome.css 탭에 붙여넣고 저장을 클릭하십시오. 이렇게하면 기본 userChrome.css 파일이 제공됩니다..

    @namespace url ( "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
    # appmenu-button
    배경 : #orange! important;

    # appmenu-button dropmarker : before
    내용 : "Firefox"! 중요;
    color : #FFFFFF! 중요;

    # appmenu-button .button-text
    표시 : 없음! 중요;

    이미 userChrome.css 파일이있을 수 있습니다.이 경우 userChrome.css 탭에 텍스트가 이미 있습니다. 첫 번째 행 인 @namespace 행을 제외한 모든 텍스트를 복사하여 @namespace 행 뒤의 탭에 붙여 넣으십시오. 이미 갖고있는 것을 지키고 싶다면 위의 텍스트를 파일 끝에 붙여 넣을 수 있습니다.

    중요 : userChrome.css의 모든 인용 부호가 @namespace 행의 인용 부호를 포함하여 현명한 인용 부호가 아닌지 확인하십시오. 평범하고 직선으로 인용해야합니다. 그들 중 하나가 똑똑한 따옴표 인 경우, 파일은 Firefox의 외형에 전혀 영향을 미치지 않습니다..

    새로운 또는 수정 된 userChrome.css 파일을 사용하여 Firefox를 다시 시작하려면 다시 시작을 클릭하십시오..

    이 예제에서는 배경색을 진한 파란색으로 변경하고 "Firefox"텍스트를 "How-To Geek".

    배경색을 변경하려면 16 진수 색상 코드 또는 HTML 색상 코드를 사용하여 "# appmenu-button"섹션의 "background"행에있는 "#orange"텍스트를 다른 색상으로 변경하십시오. 예를 들어, # 2C4362의 16 진수 색상 코드로 진한 파란색을 선택했습니다..

    참고 : 원하는 색상의 16 진수 색상 코드를 확인하려면 10 진수 RGB 색상에서 16 진수 색상 코드를 가져오고, 화면의 아무 곳에서나 색상을 선택하고, 여러 가지 형식으로 색상 코드를 가져 오는 방법에 관한 기사를 참조하십시오..

    버튼의 텍스트를 변경하려면 "# appmenu-button dropmarker : before"섹션의 "content"행에서 "Firefox"텍스트를 "How-To Geek"과 같이 원하는 텍스트로 변경하십시오. 텍스트 뒤에 공백을 추가하여 텍스트와 버튼의 드롭 다운 화살표 사이에 공간을 확보했습니다..

    동일한 "# ​​appmenu-button dropmarker : before"섹션에서 "color"행을 변경하여 텍스트의 색상을 변경하도록 선택할 수도 있습니다. 우리는 텍스트 색상을 흰색 (#FFFFFF)으로 두었지만, 밝은 회색 (# F2F2F2) 또는 그와 비슷한 것으로 변경할 수 있습니다.

    변경 내용을 적용하려면 저장 후 다시 시작을 클릭하십시오..

    버튼은 이제 진한 파란색이며 "How-To Geek".

    배경색을 변경하는 것 외에도 단추에 배경 이미지를 추가 할 수 있습니다. How-To Geek favicon이 왼쪽에 있고 투명한 배경으로 어두운 파란색 배경색이 표시되는 이미지를 만들었습니다. 버튼에 배경 이미지를 추가하려면 "# appmenu-button"섹션에 다음 행을 추가하고 따옴표 안의 경로를 컴퓨터의 이미지 위치로 변경하십시오. 경로에 "file : ///"을 남겨 둡니다..

    background-image : url ( "file : /// C : /Users/Lori/Pictures/htg_background.png")! important;

    저장 후 다시 시작을 클릭하십시오..

    이제 버튼이 완성되었습니다..

    Firefox 메뉴 버튼을 아이콘으로 변환하여 사용자 정의 할 수도 있습니다. 또한 Firefox를 최대한 활용하기위한 많은 팁과 개조를 게시했습니다..