내부 Chrome 페이지에 맞춤 스타일 적용

크롬에서 사용하는 내부 페이지에 맞춤 스타일을 적용하고 싶습니다. (새 탭 페이지와 같습니다.)

나는 여기서 말한 것을 해왔다.

Chrome을 해킹하여 내부 페이지가 검은 색으로 표시되도록합니다.

Chrome 32는 더 이상 Custom.css를 지원하지 않기 때문에 더 이상 작동하지 않습니다.

Chrome 33+에서 내부 Chrome 페이지의 스타일을 지정하는 방법이 있나요?

좋아, 그래서 이걸 좀 수색 해 보니 네가 양철통 에뮬레이트하다 custom.css 확장 기능 사용.

방법은 다음과 같습니다.

1. 디렉토리를 만들고이 안내서에 생성 할 파일을 디렉토리에 저장하십시오.
2. 이동 chrome://extensions
3. '개발자 모드'를 선택하십시오.
4. "압축을 푼 확장 파일로드"를 클릭하십시오.
5. 방금 작성한 디렉토리를 선택하십시오.

이제 방금 만든 디렉토리를 열고 다음 파일을 만듭니다.

manifest.json

{
   "content_scripts": [{
      "js": [ "inst.js" ],
      "matches": [ "<all_urls>" ]
   }], 
   "key": "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC4r/pUHVPYQTn7vu3YHT52I0SKM15OBOTi0Jii4q5Koxd3Gdc/WXdqC2YgMA25J5PRiSubu/nHFf12Ubp3OZyNqB3j45ZscQ+tH1bwcV+cqdvv/Ik6VQaS6/qLmenLdFPKOCg/g1L1iKZu6Jjny6GlovpBj+7gjWQZBIoGBd70HQIDAQAB",
   "manifest_version": 2,
   "name": "Emulate Custom.css",
   "version": "1.0",
   "web_accessible_resources": [ "Custom.css" ]
}

inst.js

if (location.protocol === 'chrome:') (function() {
    'use strict';
    var l = document.createElement('link');
    l.rel = 'stylesheet';
    l.href = chrome.runtime.getURL('Custom.css');
    document.head.appendChild(l);
})();

Custom.css

/* whatever you had in your Custom.css */

이렇게하면 CSS가 모두 Chrome 내부 페이지에만 삽입됩니다. chrome: 실험 계획안. 추가하는 모든 규칙 Custom.css 여기에 Chrome 내부 페이지가 삽입됩니다.

새 탭 페이지는 다음과 같습니다. 아니 이제 Chrome의 내부 페이지입니다. 캐시에서로드됩니다. https://www.google.com/_/chrome/newtab?espv=210&ie=UTF-8. 이 URL은 Chromium 이외의 브라우저에서 분리되며 Google 크롬 32 이상을 제외하고 Chromium 브라우저의 홈페이지로 리디렉션됩니다.

편집 : 설정을 발견했습니다. chrome://flags 확장 기능을 chrome:// 페이지. 사용 가능한 위치 : chrome://flags/#extensions-on-chrome-urls. 그러나이 경우에도 특정 크롬 내부 페이지를 지정해야합니다. <all_urls> ...에서 manifest.json, 예 : chrome://newtab등.

동일한 콘텐츠를 복사하는 중 이리 ..

devtools 스타일을 맞춤 설정하려면 chrome.devtools.panels.applyStyleSheet를 사용해야합니다. 이 기능은 현재 깃발 (--enable-devtools-experiments, Chrome 다시 시작이 필요함) 및 체크 박스 (깃발을 사용 설정 한 후 devtools를 열고 기어 아이콘을 클릭하고 실험으로 이동 한 다음 'UI 테마 허용' ").

manifest.json

{
"name": "<name> DevTools Theme",
"version": "1",
"devtools_page": "devtools.html",
"manifest_version": 2
}

devtools.html

<script src="devtools.js"></script>

devtools.js

var x = new XMLHttpRequest();
x.open('GET', 'Custom.css');
x.onload = function() {
chrome.devtools.panels.applyStyleSheet(x.responseText);
};
x.send();

Custom.css

/* whatever you had in your Custom.css */