Thay đổi nền trắng trong các trang web sang màu khác


47

Tôi hiện đang sử dụng một chủ đề tối trong Firefox. Nó trông thực sự đẹp, nhưng nhiều trang web sử dụng nền trắng trơn. Sự tương phản kết quả là một chút khó chịu và đôi khi làm tổn thương mắt khi tôi chuyển từ tab tối sang tab trắng.

Có cách nào để làm cho firefox thay thế backgrouns trắng ở mọi nơi bằng một số màu khác (ví dụ như màu xám nhạt) không? Nó có thể là một tập lệnh thời trang, hack userChrom.css hoặc bất cứ thứ gì hoạt động (tốt nhất là càng nhẹ càng tốt).

Để làm cho tôi rõ ràng: sau khi tôi đạt được mục tiêu của mình, màu nền bất cứ khi nào tôi truy cập trang web Superuser nên có màu xám nhạt thay vì màu trắng và điều tương tự sẽ xảy ra với bất kỳ trang web nào khác có nền màu trắng (các trang web google, crunch công nghệ, v.v. ).

Có cách nào làm được việc này không?


5
Tôi khuyên bạn nên chống lại điều này, hầu hết các trang web sử dụng nhiều lớp và CSS khác nhau để tạo kiểu văn bản. Điều gì xảy ra khi bạn có nền đen VÀ văn bản màu đen, theo kiểu trên trang web? Hệ điều hành nào bạn sử dụng không quan tâm?
danixd

Windows 7 chủ yếu, mặc dù một giải pháp độc lập nền tảng sẽ tốt hơn 'vì tôi cũng sử dụng ubuntnu trong công việc. Tôi biết nó có thể gây ra một số hành vi khó xử với một số trang web và nền sẽ phải có màu xám nhạt thay vì màu đen để văn bản có thể đọc được. Nhưng điều này đã làm phiền tôi đến mức tôi sẵn sàng thử nghiệm.
Malabarba

Nhiều addon khác nhau có thể thực hiện việc này - ví dụ addons.mozilla.org/En-us/firefox/addon/ mẹo
Wilf

Câu trả lời:


21

Tôi vừa viết một tập lệnh Greasemonkey nhanh chóng để kiểm tra kiểu tính toán của bodyphần tử và thay đổi nó thành màu đen (có lẽ bạn muốn chọn một màu khác):

(function () {
    if (window.getComputedStyle(document.body, null).getPropertyValue("background-color") == "rgb(255, 255, 255)") {
        console.log("Setting new background color...");
        document.body.setAttribute("style", "background-color: #000000;");
    }
})();

Vấn đề với những loại điều này là trừ khi các trang web được thiết kế cực kỳ tốt, sẽ có những đốm trắng trên nền đen.


4
Tha thứ cho sự thiếu hiểu biết của tôi, nhưng tôi dán kịch bản này ở đâu? (cảm ơn vì sự cố)
Malabarba

@Bruce: Cài đặt Greasemonkey, tạo tập lệnh người dùng mới cho * và dán mã này vào trình soạn thảo văn bản. Lưu và làm mới trang.
Hello71

Ok, phương pháp này hoạt động tốt nhất cho đến nay. Nó không thay đổi nền của hộp văn bản và một vài thứ khác, nhưng khác với nó là tốt. Tôi đoán bất kỳ giải pháp nào cũng sẽ để lại một vài hộp trắng nằm xung quanh. cảm ơn
Malabarba

Có kịch bản sẵn sàng để tải về, chỉ cần cuộn xuống.
valentt

14

Đây không phải là một giải pháp hoàn hảo nhưng bạn có thể làm điều này bất cứ khi nào bạn truy cập các trang web bạn muốn thay đổi nền.

Trong Firefox dưới 38, đi đến Tools > Options > Contentvà nhấp vào Coloursnút. Trong Firefox 38 trở lên, hãy Edit > Preferences > Contentnhấp vào và nhấp vào đó Colors.

Chọn màu xám cho "Nền" và xóa các hộp kiểm gần "Cho phép các trang chọn màu của riêng chúng, thay vì các lựa chọn của tôi ở trên" và "Sử dụng màu hệ thống".

văn bản thay thế


Điều này xứng đáng được bỏ phiếu là dễ nhất. Nó hoạt động trên hầu hết các trang web. Nó buộc bạn phải thay đổi màu văn bản, và điều đó làm cho nó hơi thua kém một vài phương thức khác.
Malabarba

2
@Bruce Connor: Đúng. Mặt khác, trong trường hợp có thể nếu bạn thay đổi màu bg, bạn cũng sẽ phải thay đổi màu fg, để có được độ tương phản hợp lý. Vì vậy, trong thực tế phải thay đổi màu văn bản có thể không phải là một nhược điểm lớn.
sleske

2
nếu bạn sử dụng tùy chọn Firefox như được mô tả ở đây, bạn nên sử dụng addon như "Không màu" để nhanh chóng bật / tắt (vì thay đổi màu sắc sẽ gây ra nhiều lỗi khác nhau trên nhiều trang web). Ngoài ra, sử dụng addon Pentadactyl để có thể gán bất kỳ hành động nào cho bất kỳ khóa nào (bao gồm cả bất kỳ tùy chọn Firefox nào được bật).
corvinus

Điều này không ghi đè màu nền khi được chỉ định
Vlad

11

Tôi đã cập nhật tập lệnh Greasemonkey (Firefox) để loại bỏ nền trắng.

Các tập lệnh sẽ hoạt động trong Chrome nếu bạn cài đặt Tampermonkey.

http://userscripts-mirror.org/scripts/show/142763

Điều này thay đổi tất cả các nền trắng thành màu xám (ish) với một số bóng. Bạn có thể định cấu hình và đặt màu cơ sở của riêng bạn từ mã chung. Sắc thái của màu trắng cũng được kết xuất.

Tôi có ba biến thể: Xám , HồngXanh lục - tất cả đều có thể được tùy chỉnh.

Tìm kiếm trong tập lệnh người dùng cho noWhiteBackgroundColor .


Hoạt động hoàn hảo - đây sẽ là câu trả lời
Mr_and_Mrs_D 10/07/2015

4

Tôi khám phá gần đây này firefox addon Stylish . Điều này sẽ làm những gì bạn muốn và nhiều hơn nữa!


4

Javascript sau đây sẽ ghi đè các thành phần nền CSS và HTML bằng màu trắng và các thành phần văn bản có màu đen trên trang hiện tại, chỉ cần dán nó vào vị trí hoặc trường trình duyệt của bạn:

javascript:(function(){
   var newSS,styles='* {background-color:black !important;color:white !important}
   :link,:link *{color:#99C0EB !important}
   :visited,:visited *{color:#C398EB !important}';

    if(document.createStyleSheet){
        document.createStyleSheet("javascript:'"+styles+"'");
    }else{
        newSS=document.createElement('link');
        newSS.rel='stylesheet';
        newSS.href='data:text/css,'+escape(styles);
        document.getElementsByTagName("head")[0].appendChild(newSS);
    }
})();

Ừ Đau đớn% 20.
Hello71

Điều này biến nền của tất cả các thành phần thành màu đen và tất cả các thành phần (không chỉ văn bản) thành màu trắng.
Hello71

1
Điều này thực sự hoạt động tốt. Tôi đã thay đổi màu đen để lightgrey , và loại bỏ các phần đó thay đổi màu sắc văn bản, vì vậy văn bản vẫn là màu đen. Và kết quả thực sự khá tốt. Vấn đề duy nhất là nó thay đổi nền tảng của tất cả mọi thứ, không chỉ là màu trắng, vì vậy rất nhiều thứ bị ẩn (như các nút bỏ phiếu ở đây trong SU). Có cách nào để khắc phục điều đó?
Malabarba

1
@ hello71, bằng cách nào đó khi tôi dán cái này trong trình duyệt của mình, nó đã thay đổi tất cả các khoảng trắng thành% 20. Những cái này đã được gỡ bỏ. Tôi nói nó đã thay đổi tất cả các nền đen, tôi đã chỉnh sửa nó để bây giờ chỉ thay đổi nền văn bản màu đen, thử lại.
Dour High Arch

4

Trong thanh tìm kiếm của trình duyệt, gõ about:config.

Trong trường tìm kiếm, nhập browser.display.background_color.

Nhấp đúp chuột vào chuỗi và thay đổi #FFFFFF(mã thập lục phân cho màu trắng) thành #000000(mã thập lục phân cho màu đen) hoặc bất kỳ màu nào khác bạn muốn và nhấp vào OK. Khởi động lại trình duyệt để nó có hiệu lực.


3

Trong thanh URL, gõ about: config và điều hướng đến cài đặt này: browser.display.background_color

Thêm thông tin nếu bạn cần nó ở đây .


1
Thay đổi biến này chỉ hoạt động trên các trang web không chỉ định màu nền. Tôi chỉ có thể làm cho nó hoạt động trên google.com/firefox và trên các tab trống.
Malabarba

1
Fireorms sẽ cho phép bạn thay đổi các trang nhưng bạn sẽ phải làm điều đó mỗi khi bạn truy cập trang web. Chỉ thay đổi nền trắng là khó khăn.
jer.salamon


3

Gần đây tôi đã thay thế máy tính cũ của mình và cần thiết lập lại Firefox. Một trong những điều chính tôi muốn khôi phục là tập lệnh Greasemonkey đã thay đổi màu nền của bất kỳ trang web nào.

Do đó tôi hơi khó chịu vì tôi không thể tìm thấy cái tôi đã sử dụng trước đây. Câu chuyện dài - đây là một từ PC cũ của tôi.

Kịch bản này không phải là tác phẩm của riêng tôi

Tất cả tín dụng phải đến Howard Smith. Điều này ban đầu được đăng trên Userscripts.org mà dường như không có.

Chỉ cần tạo tập lệnh người dùng mới trong Greasemonkey và dán đoạn mã sau vào:

(function () {
    function noWhiteBackgroundColor() {
        function changeBackgroundColor(x)  {  // Auto change colors too close to white
            var backgroundColorRGB = window.getComputedStyle(x, null).backgroundColor;  // Get background-color
            if(backgroundColorRGB != "transparent")  {  // Convert hexadecimal color to RGB color to compare
                var RGBValuesArray = backgroundColorRGB.match(/\d+/g); // Get RGB values
                var red   = RGBValuesArray[0];
                var green = RGBValuesArray[1];
                var blue  = RGBValuesArray[2];

                // ============================================================================
                // Set the base colors you require:
                // Use: http://www.colorpicker.com
                // to find the RGB values of the base colour you wish to
                // suppress white backgrounds with:
                // Default gray provided:
                // ============================================================================

                var red_needed   = 220;
                var green_needed = 220;
                var blue_needed  = 255;


                if (red>=220 && green>=220 && blue>=220) { // White range detection

                   if (red>=250 && red<=255 && green>=250 && green<=255 && blue>=250 && blue<=255) {
                      red_needed   += 0;
                      green_needed += 0; }

                   else if (red>=240 && red<=255 && green>=240 && green<=255 && blue>=240 && blue<=255) {
                      red_needed   += 6;
                      green_needed += 3; }

                   else if (red>=230 && red<=255 && green>=230 && green<=255 && blue>=230 && blue<=255) {
                      red_needed   += 10;
                      green_needed += 5; }

                   else if (red>=220 && red<=255 && green>=220 && green<=255 && blue>=220 && blue<=255) {
                      red_needed   += 14;
                      green_needed += 7; }

                   x.style.backgroundColor = "rgb( " + red_needed + ", " + green_needed + ", " + blue_needed + ")"; // The background-color you want
               }
            }
        }

        var allElements=document.getElementsByTagName("*"); // Get all elements on a page
        for(var i=0; i<allElements.length; i++)  {
            changeBackgroundColor(allElements[i]);}
    }
    window.addEventListener("DOMContentLoaded",noWhiteBackgroundColor, false);
})();

Tôi đã sử dụng điều này trong gần hai năm và không thể nghĩ ra bất kỳ trang web nào mà nó không thể thay đổi nền trắng.


Kịch bản tuyệt vời! Bây giờ nếu chỉ nó sẽ hoạt động cho các trang nội bộ trong Firefox như about: addons, about: config, about: newtab, view-source: * .. Bạn có thể thêm phần siêu dữ liệu ở đầu để dễ nhập hơn. Tôi đang sử dụng tập lệnh này kết hợp với bổ trợ Chuyển đổi màu.
jk7


2

Màu sắc

Tôi dùng nó.

Tô màu các trang web bằng các điều khiển nâng cao cho màu sắc, độ bão hòa, độ sáng và độ mờ. Tên miền web danh sách trắng để tự động tô màu (tùy chọn!).

MỚI: Sử dụng kéo và thả để sao chép chủ đề dưới dạng văn bản và để tự do nhóm các thuộc tính màu.

PS: cộng với chủ đề Firefox tối


Thật không may, không có sẵn cho FF v57 trở lên.
KERR

1

Nhấp vào thanh bằng nút chuột trái và tùy chỉnh và bạn sẽ thấy một cây xanh, đặt nó vào thanh và nhấp vào nó. Màu sắc sẽ thay đổi và bạn vẫn có thể tạo màu của riêng mình trong mục menu Chỉnh sửa -> tùy chọn -> nội dung -> màu.

Vô hiệu hóa: sử dụng màu hệ thống và cho phép các trang


0

Mặc dù không chính xác những gì bạn đang theo đuổi ... Tôi sử dụng một phần mềm được ghép nối với một đoạn script nhỏ trong OS X. Phần mềm này được gọi là Nocturne. Kịch bản tìm ra thời gian mặt trời mọc và mặt trời lặn ở vị trí địa lý của tôi. Sau đó, nó kích hoạt Nocturne lúc mặt trời lặn và tắt nó vào lúc mặt trời mọc. Tôi không biết cụ thể về Firefox, nhưng nó chắc chắn là tốt vì nó hoạt động trên mọi trình duyệt và hầu hết các phần mềm khác.


0

Phần bổ trợ http://addons.mozilla.org/en-US/firefox/addon/black-background-white-text có một phương pháp khác cho các màu đen. Nó chỉ đảo ngược màu sắc và hình ảnh nền (đảo ngược màu sắc sẽ không phá hủy thiết kế trang như trong các phương thức CSS hoặc JavaScript). Bạn sẽ thích nó, bạn cảm thấy như thể bạn đang ở chế độ màu trắng và bạn không phải cài đặt bất kỳ chủ đề nào.

Sau khi cài đặt, thay đổi phương thức mặc định từ "css đơn giản" thành "đảo ngược" trong: menu Công cụTiện íchNền đen và văn bản trắngPhương pháp mặc định thay đổi màu trangĐảo ngược .

Lưu ý: Nếu bạn cũng đã thay đổi chế độ Windows thành màu đen, thì bạn sẽ thấy tốt hơn khi tắt chức năng quản lý màu Firefox mặc định và để tiện ích bổ sung thực hiện tất cả công việc, hãy làm điều này: menu Công cụTùy chọnNội dungMàu sắc → bỏ chọn "Sử dụng màu hệ thống" và chọn "Không bao giờ" trong "Ghi đè các màu được chỉ định bởi trang bằng các lựa chọn của tôi ở trên".

Sau đó khởi động lại Firefox!

Mẹo: Tiện ích bổ sung đặt một nút trong thanh của bạn để tắt hoặc thay đổi các chế độ từ phương thức "đảo ngược" sang phương thức "CSS" hoặc phương thức "JavaScript".

Đây là kết quả:

BlackFirefox


Liên kết bị hỏng ( Không tìm thấy trang ).
Peter Mortensen

-1

Một tùy chọn khác là chỉ sử dụng Ring of Topaz để thay đổi màu nền hoặc xóa mặt sau.

Khi bạn truy cập trang web, hãy nhập URL của trang web và chọn kết hợp màu nền / phông chữ dễ đọc hơn cho bạn.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.