css3字体可以模糊吗


本文摘自PHP中文网,作者藏色散人,侵删。

css3字体的可以模糊的;开发者可以使用CSS3中的filter属性来实现字体模糊效果,filter语法是“filter: blur(px);”,其filter属性定义了元素的可视效果。

本教程操作环境:windows7系统、CSS3版本,DELL G3电脑。

推荐:css视频教程

我们可以使用CSS3 filter属性来实现字体模糊效果;语法:filter: blur(px);

filter 属性定义了元素(通常是<img>)的可视效果(例如:模糊与饱和度)。

其中属性值blur(px)可以给图像设置高斯模糊。"radius"一值设定高斯函数的标准差,或者是屏幕上以多少像素融在一起, 所以值越大越模糊;如果没有设定值,则默认是0;这个参数可设置css长度值,但不接受百分比值。

示例:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <style>

            .blur {

-webkit-filter: blur(1px); /* Chrome, Opera */

-moz-filter: blur(1px);

-ms-filter: blur(1px);

filter: blur(1px);

}

        </style>

    </head>

    <body>

    <p>正常字体</p>

        <p class="blur">模糊的字体</p>

    </body>

</html>

效果图:

ffe1f856da539c20f9e93928014d663.png

以上就是css3字体可以模糊吗的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

css如何给边框添加图像?css设置边框图像

css <basic-shape>的基本形状函数有哪些?如何使用?

CSS3如何实现流星雨效果?(代码示例)

如何解决CSS3 media不起作用的问题

CSS3 icon属性怎么用?

css nth-of-type和nth-child的区别是什么?

使用CSS3模拟打字效果(代码实例)

border-image-width属性怎么用

perspective-origin属性怎么用

css实现页面底部固定的方法介绍(附代码)

更多相关阅读请进入《CSS3》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...