Hướng dẫn cách tạo chữ với hiệu ứng tuyệt đẹp cho blogspot

Xuất bản - tháng 7 21, 2018
CÁCH SỬ DỤNG:
Bước 1: Các bạn dán toàn bộ code bên dưới vào ]]></b:skin>
svg { display: block; font: 100px 'Roboto condensed'; width: auto; max-width:600PX; height: auto; margin: 0 auto; }Bước 2. Chèn toàn bộ HTML sau vào nới bạn muốn:
.text-copy { fill: none; stroke: white; stroke-dasharray: 6% 29%; stroke-width: 5px; stroke-dashoffset: 0%; animation: stroke-offset 5.5s infinite linear; }
.text-copy:nth-child(1) { stroke: #6699FF; animation-delay: -1; }
.text-copy:nth-child(2) { stroke: #6699FF; animation-delay: -2s; }
.text-copy:nth-child(3) { stroke: #0099FF; animation-delay: -3s; }
.text-copy:nth-child(4) { stroke: #0099FF; animation-delay: -4s;}
.text-copy:nth-child(5) { stroke: #FF99FF; animation-delay: -5s; }
@keyframes stroke-offset { 100% {stroke-dashoffset: -35%;} }
.cloud { padding:0; }
.cloud li {
list-style: none;
display: inline;
}
.cloud li>a { color :gray; }
.cloud li>a:hover { color : white; }
.cloud li:nth-of-type(3n + 1) {
font-size: 1.25em;
}
.cloud li:nth-of-type(4n+3) {
font-size: 1.5em;
}
.cloud li:nth-of-type(5n - 3) {
font-size: 1em;
}
<svg viewbox="0 0 960 180">
<symbol id="s-text"><text text-anchor="middle" x="50%" y="80%">LÊ BÁ LONG IT</text></symbol>
<g class="g-ants">
<use class="text-copy" xlink:href="#s-text" xmlns:xlink="http://www.w3.org/1999/xlink"></use>
<use class="text-copy" xlink:href="#s-text" xmlns:xlink="http://www.w3.org/1999/xlink"></use>
<use class="text-copy" xlink:href="#s-text" xmlns:xlink="http://www.w3.org/1999/xlink"></use>
<use class="text-copy" xlink:href="#s-text" xmlns:xlink="http://www.w3.org/1999/xlink"></use>
<use class="text-copy" xlink:href="#s-text" xmlns:xlink="http://www.w3.org/1999/xlink"></use>
</g>
</svg>
LỜI KẾT
Nếu có thắc mắc hoặc góp ý cmt ngay bên dưới nhé !!! Cảm ơn đã đọc <3
bay đâu widget liên kết rồi
Trả lờiXóathôi khỏi thấy rồi
Xóahé lô
Trả lờiXóa
anh thay domain cài domain cũ là chuyển hướng cho dễ tìm
Trả lờiXóaem đã sửa lại liên kết nhá
blogspot.com đi e
Xóa
em lỡ cài .ooo òi nhát thay 
XóaHay ddos
Trả lờiXóaThank bác
Xóanay anh long vào temp ò ó o r
cơ mà cho em css phần popular post với
Trả lờiXóaOke vào team adsen
Xóaquăng ở đây i ><
Xóa/* Popular Posts */
Xóa.PopularPosts .widget-content ul, .PopularPosts .widget-content ul li, .PopularPosts .widget-content ul li img, .PopularPosts .widget-content ul li a, .PopularPosts .widget-content ul li a img {
margin:0 0;
padding:0 0;
list-style:none;
border:none;
outline:none;
}
.PopularPosts .widget-content ul {
margin: 0;
list-style:none;
counter-reset:num;
border-left:1px solid #efefef;
border-right:1px solid #efefef;
}
.PopularPosts .widget-content ul li img {
display: block;
width: 70px;
height: 70px;
float: left;
}
.PopularPosts .widget-content ul li {
margin: 0 0 0 0 !important;
counter-increment: num;
position: relative;
border-top:1px solid #efefef;
padding: 8px 10px;
}
.PopularPosts ul li:last-child {
border-bottom:1px solid #efefef;
}
.PopularPosts li:nth-child(odd) {
background: #efefef;
}
.PopularPosts li:nth-child(even) {
background: #f8f8f8;
}
.PopularPosts ul li .item-title a, .PopularPosts ul li a {
font-weight: 500;
text-decoration: none;
color: $(link.hover.color);
}
.PopularPosts ul li .item-title a:hover, .PopularPosts ul li a:hover {
color: $(link.color);
}
.PopularPosts .item-title {
line-height: 1.6;
}
.PopularPosts .item-thumbnail {
float: left;
margin: 3px 8px 0 0;
}
.PopularPosts .item-snippet {
line-height: 1.7em;
color: #888;
font-size: 14px;
}
cảm ơn anh nhiều nha
Xóasáng má cho năm ngàn chiều má cho năm ngàn nữa là mười ngàn
Trả lờiXóaChết đói
Xóađổi temp đi , Thèn Đức share tùm lum nát bét r , admin Quang Thìn phải sài theme chất chứ
Trả lờiXóahay quá
Trả lờiXóaThank you
Xóa
depdj
Trả lờiXóaphai dep thoi
Xóayollooooo
Trả lờiXóa
XóaTôi là một nhân viên tư nhân cũng như một blogger
Trả lờiXóaNam said : Hahah !!! =)
tôi là 1 công nhân
Xóađổi temp đi
Xóaquá dữ
Trả lờiXóa1 năm cmt 1 lần -_- ghét òi
Xóachào buổi sáng nhan tiểu thư
Trả lờiXóawhat
Xóa