20:03 - 14/6/18 / 4 nhận xét

Tạo chữ 7 màu chạy liên tục bằng Css3

Bạn không biết photoshop để thiết kế logo giống mình, đừng ngại, hãy dùng chữ 7 màu chạy liên tục này làm luôn logo, khỏi mất công photoshop hihi. Bạn cũng có thể dùng vào nhiều việc khác nữa!

..và đây là Demo:

BlogKiemTien

Hoặc đây nữa (chỉnh CSS 1 xíu: font:39px Times bold)

WORLD CUP 2018

Để tạo được chữ như vậy rất đơn giản, chỉ việc chèn đoạn CSS này vào trước thẻ ]]></b:skin>

.fontpro{font-family: 'Bowlby One SC', cursive; font-size:80px; text-align: center;  background: linear-gradient(   60deg,   hsl(0, 75%, 50%) 10%, hsl(20, 75%, 50%) 10%,   hsl(20, 75%, 50%) 25%,   hsl(50, 75%, 50%) 25%,   hsl(50, 75%, 50%) 40%,   hsl(130, 75%, 50%) 40%, hsl(130, 75%, 50%) 55%,   hsl(200, 75%, 50%) 55%,   hsl(200, 75%, 50%) 70%,   hsl(260, 75%, 50%) 70%,   hsl(260, 75%, 50%) 85%,   hsl(0, 75%, 50%) 85%  ); text-shadow: 0.5px -0.6vw #fff4; color: #fff; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: 10s BeProud linear infinite } @keyframes BeProud {100% { background-position: 100vw 0px }}

Chèn code nơi cần hiển thị: <div class='fontpro'>BlogKiemTien</div>

Ưu điểm:

• Nhẹ, do chỉ là CSS
• Tính thẩm mỹ cao
• Và rất độc đáo nữa

Vậy là xong. Chúc các bạn thành công. Muốn mình viết tiếp bài về thủ thuật gì, comment bên dưới nha!

[Khôi Ròm]