首页 > html > text > Page Widget - 如何创建与文本阴影的字体阴影

Page Widget - 如何创建与文本阴影的字体阴影

text 【text】
我们想知道如何创建与文本阴影的字体阴影。
代码展示 运行结果 

<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
.Text {
  font-family: sans-serif;
  background-color: #222;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: rgba(255, 255, 255, 0.4) 0px 3px 3px;
}

h1 {
  font-size: 65px;
  margin-top: 30px;
  margin-left: 65px;
}

body {
  background-color: #b3b3b3;
}
</style>

</head>
<body>
  <h1 class="Text">w3cschool.cn</h1>
</body>
</html>