苹果手机qq字体颜色设置在哪里,苹果手机qq字体大小在哪改

首页 > 实用技巧 > 作者:YD1662023-11-05 02:08:05

首先我们打开腾讯网的首页,按F12进入浏览器控制台,强哥猜测应该是改的整体的样式,估计是在body标签上直接加的样式。

苹果手机qq字体颜色设置在哪里,苹果手机qq字体大小在哪改(5)

果然,我们可以看到在首页的body标签上有一个名为garyBody的class(这里我们猜测可能是开发小哥哥手误把gray灰色的英文敲成了gary),然后这个类名的css是下面这样的:

苹果手机qq字体颜色设置在哪里,苹果手机qq字体大小在哪改(6)

原来道理十分简单,腾讯是使用了CSS3中的filter滤镜,并把它设置为grayscale来实现这个功能,只要把grayscale设置为100%就可以把文字和图片在内的所有元素都变成黑白色(100%灰度)了,当然在实际工作中,这个百分比都是可以根据需求来自行更改的。另外考虑到浏览器兼容性的问题,我们还需要给filter加上浏览器前缀比如-webkit,-moz等等以适应不同的浏览器,我们可以看到腾讯的代码中已考虑到了当前主流的浏览器。

当我们把这个名为garyBody的class去掉之后,我们就可以发现腾讯网又恢复成往日的彩色了。随后我们又去了淘宝、百度等几个主流网站看了一下,发现也都是用的几乎一样的方法。

苹果手机qq字体颜色设置在哪里,苹果手机qq字体大小在哪改(7)

当然了,filter这个属性的功能可远远不止这一点,除了grayscale,我们还可以把filter设置成blur(px),这是给头像设置高斯模糊,设置的px越大就会越模糊,我们来看看设置成3px时的效果:

苹果手机qq字体颜色设置在哪里,苹果手机qq字体大小在哪改(8)

上一页123下一页

栏目热文

文档排行

本站推荐

Copyright © 2018 - 2021 www.yd166.com., All Rights Reserved.