<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<style>
img {
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
filter: grey; -moz-opacity:.4;opacity:0.4;; /* IE6-9 */
-webkit-filter: grayscale(80%); /* Chrome 19+ & Safari 6+ */
}
</style>
</head>
<body>
<img src="20130805144335.jpg">
</body>
</html>
分享到：
相关推荐
在这个特定的问题中，我们关注的是如何通过CSS实现鼠标悬停时图片效果的变化，比如图片变灰、变色以及半透明。下面将详细介绍这些效果的实现方法。 1. 图片变灰： 当鼠标悬停在图片上时，可以使用CSS的`filter`...
要让图片变灰，可以利用CSS的滤镜（filter）属性，特别是`grayscale()`函数。这个函数可以将图片转换为灰度图像，参数值为0表示无灰度效果，1表示完全灰度。例如，我们有一个图片元素： ```html ...
这个“css滤镜实现鼠标悬停图片变黑白(灰色).zip”压缩包提供了一个实例，展示了如何利用CSS和JavaScript来实现一个交互式的图片处理效果：当鼠标悬停在图片上时，图片会变为黑白（或称灰色）。 首先，我们来看...
"图片 灰色"这一主题表明，模板采用了灰色调，这种色彩通常赋予网站一种专业和低调的氛围。CSS文件将定义页面的样式，包括颜色、字体、布局、响应式设计等。在图片站中，良好的视觉体验尤为关键，设计师可能通过CSS3...
这个灰色简洁的HTML5模板利用了CSS3的特性，比如可能使用了灰色调的背景颜色和阴影效果来实现简洁的设计风格，可能通过CSS3的边框半径（border-radius）来创建圆角，使用渐变（gradients）或图案（patterns）作为...
在"灰色免费英文网站CSS模板_灰色 英文 html.zip"这个压缩包中，"灰色免费英文网站CSS模板_灰色 英文 html"文件很可能是包含HTML代码的文档。HTML通过一系列标签来定义网页元素，如标题、段落、链接、图片等。例如，...
标题中的“图片站网页模板-图片 灰色.rar”表明这是一个用于创建图片展示网站的网页模板，且设计风格为灰色调。这个压缩包文件很可能包含了一系列HTML、CSS和JavaScript文件，以及可能的图像资源，用于构建一个简洁...
本文将深入探讨如何使用CSS实现一种默认图片为灰色，当鼠标悬停时变为彩色的效果，以及这一技术在JS特效和图片相册中的应用。 首先，我们来理解CSS（Cascading Style Sheets）的作用。CSS是一种样式表语言，用于...
让整个页面变灰的方法之一是通过调整页面所有元素的颜色过滤。这可以通过使用 CSS 的滤镜（filter）属性来实现。滤镜属性允许我们应用不同的视觉效果，如模糊、饱和度调整、颜色转换等。对于灰色效果，我们可以使用 ...
【网页课程设计&毕业设计_灰色网格背景个人图片博客css3网站模板.zip】是一个针对学习者和毕业生设计的网页模板项目，旨在教授和实践CSS3技术在构建个人图片博客中的应用。这个压缩包包含了必要的文件，使用户能够...
HTML模板通常包含头部、主体和尾部等部分，以及各个页面元素如标题、段落、图片、链接等。开发者可以根据需求修改模板中的内容，添加自定义的功能和设计。 在压缩包的文件名称列表中，我们可以看到一些可能包含的...
本资源"简洁的邮件CSS模板_简洁 邮件 邮箱 灰色.zip"提供了一个专门针对电子邮件设计的CSS模板，它具有简洁、灰色调的特点，适用于创建专业且吸引人的电子邮件通讯。 电子邮件设计与普通的网页设计有所不同，因为...
在这个特定的项目中，“Html+css+jquery图片头像，鼠标悬浮点击，变灰色，换肤效果”是一个实用的示例，它展示了如何利用这些技术实现一种常见的视觉效果。 首先，HTML（超文本标记语言）是网页的基础结构。在本...
4. **性能优化**：优化图片大小，压缩CSS和JavaScript文件，提高网站加载速度。 5. **SEO优化**：确保HTML标签正确使用，便于搜索引擎抓取，提高网站在搜索结果中的排名。 总的来说，"灰色免费英文网站CSS模板"是一...
要实现“鼠标移上可以让图片变灰”的功能，我们可以使用HTML和CSS结合JavaScript来完成。HTML用于构建基本结构，CSS用于样式控制，而JavaScript则用于处理交互逻辑。 1. **HTML部分**： 创建一个`<img>`元素，并为...
【压缩包子文件的文件名称列表】"h5c3_109_diverso"可能指的是该模板的一个子目录或组件，这通常包含HTML文件、CSS样式表、JavaScript脚本、图片和其他资源文件。"h5c3"暗示了HTML5和CSS3的使用，"109"可能是版本号...
在这个例子中，我们首先隐藏了图片容器，然后当复选框被选中时，通过`+`选择器展示图片容器，并应用`grayscale(100%)`滤镜使图片变灰。同时，我们添加了`transition`属性，让图片从灰色变为彩色的过程平滑进行。当复...
该压缩包文件“灰棕背景_HTML手机电脑网站_网页源码移动端前端js效果_H5模板_自适应css源码ui组件.zip”包含了用于构建响应式、自适应的HTML5网站的资源，主要聚焦于CSS、JavaScript和网站模板设计。下面我们将深入...
2. **CSS操作**：为了实现图片由灰色变彩色的效果，我们可以预先准备两份图片，一份是灰色版本，另一份是原始彩色版本。在默认状态下，显示的是灰色图片。当鼠标移过图片时，我们用JavaScript切换图片的`src`属性，...