文字
分享

语法:

-webkit-text-stroke-width:<length>

默认值0

适用于:所有元素

继承性:有

动画性:是

计算值:指定值

取值:

  • <length>:用长度值指定描边厚度。不允许负值

说明:

定义文字描边的厚度
  • 对应的脚本特性为webkitTextStrokeWidth

兼容性:

ValuesIEFirefoxChromeSafariOperaiOS SafariAndroid BrowserAndroid Chrome
Basic Support6.0-11.02.0-40.04.0-45.0-webkit-4.0-8.0-webkit-15.0-29.0-webkit-4.0-8.3-webkit-2.1-4.4.4-webkit-18.0-42.0-webkit-

示例:

实例

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

<!DOCTYPE html>

<html lang="zh-cmn-Hans">

<head>

<meta charset="utf-8" />

<title>-webkit-text-stroke-width_CSS参考手册_web前端开发参考手册系列</title>

<meta name="author" content="Joy Du(飘零雾雨), dooyoe@gmail.com, www.doyoe.com" />

<style>

html,body{font:bold 14px/1.5 georgia,simsun,sans-serif;text-align:center;}

.stroke h1{margin:0;padding:10px 0 0;}

.stroke p{

    margin:50px auto 100px;font-size:100px;

    -webkit-text-stroke-width:2px;

    -webkit-text-stroke-color:#ff0;

}

.copyright,.info{font-style:italic;}

</style>

</head>

<body>

<div class="stroke">

    <h1>描边的文字:</h1>

    <p>我是被描了2像素黄边的文字</p>

</div>

</body>

</html>

            


运行实例 »

点击 "运行实例" 按钮查看在线实例