首先我们来看一看css3中文本描边text-stroke属性。

    说明：text-stroke属性只有webkit内核的Safari和Chrome支持。

    语法：text-stroke：<'text-stroke-width'>||<'text-stroke-color'>

    属性值：

    <'text-stroke-width'>：设置或检索对象中的文字的描边厚度

    <'text-stroke-color'>：设置或检索对象中的文字的描边颜色

    来直接看一个例子：

    <h1>PHP中文网文字描边</h1>

    h1{

    -webkit-text-stroke:1.0px#000000;

    color:pink

    }

    css3文字描边效果如下：

 

    需要注意的是：

    文本描边text-stroke属性只有在字体很大的时候才能看到描边效果，如果字体比较小，描边颜色会遮住文字本身颜色，如图：

    2345截图20180926100328.png

    除了上述使用text-stroke属性来实现文字描边之外，其实还可以利用文字阴影属性text-shadow来进行文字描边，text-shadow属性的具体内容我们在css3如何设置文字阴影？css3用text-shadow设置文字阴影的方法已经介绍过了，这里就不具体说了，所以我们就来直接看text-shadow属性实现字体描边的实例：

    <h1>PHP中文网文字描边</h1>

    h1{text-shadow:2px2px0pxblue;

    color:pink;

    }

    css3文字描边效果如下：

 



 

    说明：如果觉得文字描边不够粗，可以使用多重字体阴影，这样就可以实现较粗的文字描边。

    css3较粗的文字描边代码如下：

    <h1>PHP中文网文字描边</h1>

    h1{text-shadow:

    1px1px0pxblue,

    -1px-1px0pxblue,

    2px2px0pxblue,

    -2px-2px0pxblue,

    3px3px0pxblue,

    -3px-3px0pxblue;

    color:pink;

    }

    css3文字描边效果如下：

 

    相关文章推荐：

    1.如何使用csstext-stroke属性来制作文字描边？（源代码）

    2.css3怎么给文字加描边？css3实现字体描边样式的方法（代码详解）

    相关视频推荐：

    1.CSS视频教程-玉女心经版

    以上就是本篇文章的全部内容了，关于文章中所提到的关于css3中的属性的具体内容大家可以参考css3使用手册来进行学习。