CSS3实现镂空文字

直接贴代码

css：

h1{
          text-transform: uppercase;
          font-size: 48px;
          margin: 0 0 30px 0; 
          -webkit-text-stroke: 1px black;
          color: white;
 }
h2{				/*--通过阴影做出效果--*/
          font-size: 48px;
          margin: 0 0 30px 0; 
          color: white;
          text-shadow:
            -3px -3px 0 #000,  
            1px -3px 0 #000,
            -3px 3px 0 #000,
            3px 3px 0 #000;
}
h3{									/*-这个demo需要用基于webkit内核的chrome或者safari浏览器才能看，firefox上无效-*/
          font-size: 48px;
           
          -webkit-text-stroke: 2px red;
          -webkit-text-fill-color: white; 
          color: white;
           
          -webkit-animation: colorchange 1s infinite;
          -webkit-animation-direction: alternate;
}@-webkit-keyframes colorchange {
            0% {
                -webkit-text-stroke: 10px red;
                letter-spacing: 0;
            }
            100% {
                -webkit-text-stroke: 20px green;
                letter-spacing: 18px;
            }
}

html：

HELLO
HELLO
HELLO