What are some ways to turn an entire web page into black and white?-CSS Tutorial-php.cn

What are some ways to turn an entire web page into black and white?

yulia

Release： 2018-09-20 11:38:57

Original

10571 people have browsed it

This article introduces how to turn the entire web page into black and white or black, and what methods can be achieved. If you are interested in this, you can refer to it. I hope it will be helpful to you.

CSS code for the whole site.

html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }

Copy after login

How to use: This code can change the webpage to black and white. Add the code to the top of CSS to achieve plain decoration. It is recommended that webmasters across the country take action. Condolences for the compatriots who died in the earthquake.

If the website does not use CSS, you can insert it between the HTML code and

of the web page/template:

<style>
html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
</style>

Copy after login

Some webmasters’ websites may use this The css cannot take effect because the website does not use the latest web standard protocol

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Copy after login

Please replace the at the top of the webpage with the above code.

The color of FLASH animation on some websites cannot be controlled by CSS filters. You can insert it between and in the FLASH code:

<param value="false" name="menu"/>
<param value="opaque" name="wmode"/>

Copy after login

The simplest The code to turn the page into gray is to add

<style type="text/css">
html {
    FILTER: gray
}
</style>

Copy after login

between the heads. In the general discuz forum, modify the

/images/header/header.css file under your control css file.

CSS method

Use the software Firefox (install firebug) plug-in; ie7 or IE 8 must have developer tools (press F12 to appear)

Everyone knows that in the IE browser, you can use a piece of code body {filter: gray;} to use Microsoft's filter code to decolor the entire website into a black and white gray tone effect, but it is not compatible with other non-IE browsers such as Firefox.

CSS website gray tone (only supports IE)

Inline style:

elem.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)' ;

css style sheet:

elem { filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

/* Element must "hasLayout"! */

zoom: 1;}

Because Firefox does not support filters, so yesterday I used Firefox’s children’s shoes and found that many websites (Renren, 19th floor) were still in color.

This involves browser compatibility issues, css hacks, etc.

Yesterday, I just used IE or Firefox's firebug to uncheck the box in front of body {filter: gray;}, or put elem.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)' ; Uncheck this sentence to see it in color

As for how to turn Flash into gray and how to make a black and white website compatible with various browsers, I will just post the code. As for why Having written it this way, I won’t go into details. Interested friends can search for answers online.

Greying of FLASH:

The color of FLASH animation on some websites cannot be controlled by CSS filters. It can be done in the and < of the FLASH code. Insert between ;/object>:

JavaScript

Use:

//Method 1 var el = document.getElementById( 'myEl' );grayscale( el ); // Method two grayscale( document.getElementsByTagName('div') ); // Used in jquery: grayscale( $('div') );

Reset:

grayscale.reset ( el ); // Similarly, the reset method can also be used jquerygrayscale.reset( $('div') );

Preprocessing:

grayscale.prepare( document.getElementById(' myEl') );// grayscale.prepare( $('.gall_img') );

can also be used in jquery

The above is the detailed content of What are some ways to turn an entire web page into black and white?. For more information, please follow other related articles on the PHP Chinese website!