<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> body{ background: #000000; font-family: "微软雅黑"; } .masked{ background:url(img/paint.png); -webkit-text-fill-color:transparent;/*文字的填充颜色为透明的*/ -webkit-background-clip:text;/*背景文本裁切*/ -webkit-animation-name:masked-animation; -webkit-animation-duration:20s; -webkit-animation-iteration-count:infinite; -webkit-animation-timing-function:linear; color:#fff; font-size:40px; } @-webkit-keyframes masked-animation { 0% {background-position:left bottom;} 100% {background-position:right bottom;} } .maskedTwo{ -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px #fff; font-size:40px; } </style> </head> <body> <div class="masked"> <h4>这是一段可选文字</h4> </div> <div class="maskedTwo"> <h4>这是一段可选文字</h4> </div> </body> </html>