首页 > 其他分享 >CSS让整个网站变成灰色的做法

CSS让整个网站变成灰色的做法

时间:2023-12-11 13:11:06浏览次数:35  
标签:灰色 gt 100% grayscale filter lt html 做法 CSS

CSS让整个网站变成灰色的做法

方法一:直接在css样式文件里加上这段代码

html{-webkit-filter:grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);}

<!–可以是整个网站变成灰色的–>

方法二:可以直接插入到网页/模板文件里

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

使用方法:这段代码可以变网页为黑白,将代码加到CSS最顶端就可以实现素装。

如果网站没有使用CSS,可以在网页/模板的HTML代码<head>和</head>之间插入:

<style>

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

</style>

有一些站长的网站可能使用这个css不能生效,是因为网站没有使用的网页标准协议

<!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”>

请将网页最头部的<html>替换为以上代码。

有一些网站FLASH动画的颜色不能被CSS滤镜控制,可以在FLASH代码的<object…>和</object>之间插入:

<param value=”false”name=”menu”/>

<param value=”opaque”name=”wmode”/>

最简单的把页面变成灰色的代码是在head之间加<style type=”text/css”>html{

FILTER:gray

}

</style>

方法三:

html{filter:grayscale(100%);-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);filter:url(“data:image/svg+xml;utf8,#grayscale”);filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter:grayscale(1);}

标签:灰色,gt,100%,grayscale,filter,lt,html,做法,CSS
From: https://www.cnblogs.com/akweb/p/17894157.html

相关文章

  • 图片铺满div元素不变形,超出部分隐藏,保留中心部分css代码
    在我们网站更新文章的时候,经常会插入图片,丰富信息。但是我们插入的图片长宽比例并不一定是固定的。我们在调用缩略图的时候,常常会出现图片变形的情况,高和宽不成比例。那么如何让图片不变形,又能铺满div元素呢?我们可以使用css代码中object-fit属性来实现。object-fit属性指定元素的......
  • css:两个行内块元素和图片垂直居中对齐
    (目录)两个行内块元素垂直居中对齐先看一段代码:<style>.box{width:200px;height:200px;line-height:200px;font-size:20px;text-align:center;display:inline-block;background-color:green;}</style><divclass="box&q......
  • CSS学习
    学习CSS 一、概述 CSS(层叠样式表)是一种用于描述HTML(或XML和SVG等其他标记语言)文档样式的样式表语言。它被广泛用于网页和用户界面的设计和布局。通过使用CSS,开发人员可以分离内容和样式,使网页更易于维护,提高用户体验。 二、学习资源 W3Schools、菜鸟教程三、核心概念......
  • 前端:bootstrap基本样式,css3定位,响应式布局
    前端:bootstrap基本样式,css3定位,响应式布局Css3中的position属性:css3的定位方式Css3的几种定位方式:流定位、浮动定位、相对定位、绝对定位、固定定位,默认为流定位。流定位页面中的块级元素框从上到下一个接一个地排列。每一个块级元素都会出现在一个新行中(比如<p>元素、<div>元素)。......
  • css vertical-align \ text-align 居中
    vertical-align:1、只能作用在子元素display 值为inline,inline-block,inline-table,table-cell的元素上,2、子元素设置vertical-align3、父元素高度是由line-height决定(不要乱给父元素添加height)<divclass="father"><spanclass="son">a</span></div&g......
  • CSS笔记
    1.CSS选择器是用于选取HTML文档中的元素的一种方式。常见的选择器包括:元素选择器:通过元素的标签名来选取元素,例如p、div等。类选择器:通过元素的class属性来选取元素,使用.符号加上类名,例如.my-class。ID选择器:通过元素的id属性来选取元素,使用#符号加上id值,例如#my-id。属性选......
  • 用html+css+js做canvas烟花模拟网页动画代码
    圣诞节、元旦就要到了,本案例我们将用html+css+js做canvas烟花模拟网页动画代码,程序员的浪漫这不就来了嘛,与家人朋友一起看烟花吧!   附源码<!DOCTYPEhtml><htmllang="en"><head> <metacharset="UTF-8"/> <title>烟花模拟器</title> <metaname="viewport"......
  • 网站变灰-指定日期变成灰色
      文件名: js\timedWebsiteGraysOut.js//设置每天凌晨触发一次的时间(24小时制)consttargetHour=9;//12:00AM//设置定时器,每隔一分钟检查一次constdailyCheckInterval=setInterval(dailyCheck,60*1000);functiondailyCheck(){//获取当前系统日期......
  • 3个怎么把文件发送到邮箱的正确做法,看看自己做对了吗
    在数字化时代,文件传输的方式变得越来越多样化,但将文件发送到邮箱仍然是最常见、最方便的方法之一。然而,许多人可能并不了解最有效的方法,因此本文将介绍3个怎么把文件发送到邮箱的正确做法,帮助你确保文件传输顺畅。1.通过附件方式发送文件首先,最传统也是最直接的方式是通过电子邮件......
  • 3个怎么把文件发送到邮箱的正确做法,看看自己做对了吗
    在数字化时代,文件传输的方式变得越来越多样化,但将文件发送到邮箱仍然是最常见、最方便的方法之一。然而,许多人可能并不了解最有效的方法,因此本文将介绍3个怎么把文件发送到邮箱的正确做法,帮助你确保文件传输顺畅。1.通过附件方式发送文件首先,最传统也是最直接的方式是通过电子邮件......