Mình sẽ để code ví dụ và anh em tham khảo và cùng nhau trao đổi nhé
Code
HTML<svg viewBox="0 0 100 18" style="width: 100%;height: 100%;"> <text text-anchor="middle" dominant-baseline="central" x="50%" y="50%" textLength="100%">HUYCÒVIP</text> </svg>CSS
text{ animation: 5s strokefill infinite alternate; } @keyframes strokefill { 0% { stroke: rgba(0, 0, 0, 1); fill: rgba(0, 0, 0, 0); stroke-dashoffset: 25%; stroke-dasharray: 00% 50%; stroke-width: 1.0; } 70% { fill: rgba(0, 0, 0, 0); } 80% { stroke: rgba(0, 0, 0, 1); } 100% { stroke: rgba(0, 0, 0, 0); fill: rgba(0, 0, 0, 1); stroke-dashoffset: -25%; stroke-dasharray: 50% 00%; stroke-width: 0.0; } }