Sep 30, 2011

Menu nằm dọc blog với jQuery và css

Menu for blogspot
Đây là một thủ thuật về cách tạo 1 danh mục với jQuery và css.

Danh mục này được cố định trên blog và nó có thể ẩn hiện một cách nhẹ nhàng với css.


Có thể nói đây là 1 menu trong suốt đẹp nhất từ trước tới giờ mà Yolks từ thấy và từng được xem.



1.Dăng nhập vào tài khoản --> bảng điều khiển --> Thiết kế --> Chỉnh sửa html
2.Thêm css:
/*----------------------------------------------------
{--------} Menu navigation {--------}
----------------------------------------------------*/
ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 10px;
left: 0px;
list-style: none;
z-index:9999;
}
ul#navigation li {
width: 100px;
}
ul#navigation li a {
display: block;
margin-left: -2px;
width: 100px;
height: 70px;
background-color:#CFCFCF;
background-repeat:no-repeat;
background-position:center center;
border:1px solid #AFAFAF;
-moz-border-radius:0px 10px 10px 0px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-top-right-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-top-right-radius: 10px;
/*-moz-box-shadow: 0px 4px 3px #000;
-webkit-box-shadow: 0px 4px 3px #000;
*/
opacity: 0.8;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
}
ul#navigation .home a{
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikjAZRJShxl_m7gxparvBJzczeCbiMk49yNn6ydBRFsfJl2P6nNj_Sz2AKNT3_JTx-ix_pXqsvxSKMDrdUPCh6T3Vymv9NjyeOrFRWonfOvchvs1zJkbLuag0k_N4pYPeTaBMKpPtkMWg/s1600/home.png);
}
ul#navigation .about a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEik08m1FeUI3NoyD936KTS5SWaaIyWoGQEXcG_TTH5V7f1zI5fJlxnCRpr9vLKL0-FyBvUqp-TyNd_LMju9b-OGa0GXPf2yRylJG_1FxYRjv-7slOPxxq8SXL-xo1w0bvswlwGFIeriDfw/s1600/id_card.png);
}
ul#navigation .search a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgp6Iye-9N4t3zjrKKzHTtNZoVQRR7-ewRU81jjNFDBF7-wAUmz9hC60XRMfcbOBW92gIg7yGeiXIomEeaINOkZ3V7gKDkmkuZ1V0CNPHtt9V8uChvRP-fE8qIay0pp5R-En5GWvV-kMpE/s1600/search.png);
}
ul#navigation .podcasts a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7m5U8RBgQMuskPtGd6VdrE3OJvEQd_seI-yB1sxll-R6qCAHWdlJ2vz_fs_zHUGEOGlKFLvchjk8afixlqJ0i7M7tlpryYPVpoOHSFfyyW97KWtiT-sze3JicMQVUTwczLPC7my8Jjfk/s1600/camera.png);
}
ul#navigation .rssfeed a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnEwz4VWjNk75jTmyINLN8EnV6IdMfUf6kJuM3EJqYMiMhbioQsrCI7pXw9c02K4rVyNiXnVJJGqf87QO1kpuXeEfqshRPW2m7klY73RXlpAlp1VXl2iWO5I_4R04BWE0PBU7ae0uOirk/s1600/rss.png);
}
ul#navigation .photos a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEkHxbAFIxopQUW0iIod0fI7KVhbgzkx_lx8oIGtZraYZI0K4nVHcOseEIQJDyGo_0DZAcVcXIVl32zJWl8v5ALJQJ2Lri5egRqZKGFgHlFbJY9XGBLk8IeH6Sgdg1ZyGqe3037lkObLo/s1600/ipod.png);
}
ul#navigation .contact a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFbl8k7d1O37tW6AM3_3MffQHwLzudWHqejoIWMslL7L2C0_9O0YycM0G3lWUp2XEpDDdUOP0jlbVEz9GIq54UvTYy1NW-5z3Ka6RPT61kf6VZsBbmyIKuwzyXDeELaQSkgVDGvASesz8/s1600/mail.png);
}


Những cái mà mình chú thích là màu xanh thì mấy bạn thấy nó sẽ liên quan đến các hình ảnh hiển thị trên menu. VD: bạn muốn làm 1 cái hình thông báo chẳng hạn thì đoạn mã css như sau:
ul#navigation .thongbao a  {
background-image: url(link ảnh);
}
3.Thêm js:
Tìm thẻ </head> và thêm đoạn js này trước nó:

<script type="text/javascript">
$(function() {
$('#navigation a').stop().animate({'marginLeft':'-85px'},1000);

$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
},
function () {
$('a',$(this)).stop().animate({'marginLeft':'-85px'},200);
}
);
});
</script>
4.Chèn html:
tìm </body> và chèn trước nó đoạn code:
<ul id='navigation'>
<li class='home'><a href=''><span>Home</span></a></li>
<li class='about'><a href='http://www.vngreenzone.com'><span>About</span></a></li>
<li class='search'><a href='vngreenzone.com'><span>Search</span></a></li>
<li class='photos'><a href='http://www.vngreenzone.com'><span>Photos</span></a></li>
<li class='rssfeed'><a href='http://www.vngreenzone.com'><span>Rss Feed</span></a></li>
<li class='podcasts'><a href='http://www.vngreenzone.com'><span>Podcasts</span></a></li>
<li class='contact'><a href='http://www.vngreenzone.com'><span>Contact</span></a></li>
</ul>
Nếu bạn muốn thêm 1 thẻ thông báo với đoạn code css mà Yolks nói thì như thế này
<li class='thongbao'><a href=''><span>Thông báo</span></a></li>
Nguồn : Tympanus

Sep 25, 2011

Tạo chương trình chia sẽ doanh thu cho từng tác giả trong bài viết của họ

multi author blogging for blogger
Bạn là một fan hâm mộ blogger và bạn chẳng muốn đổi qua WP chút nào.Để thắng được WP chúng ta phải nổ lực bằng cách thu hút nhiều tác giả viết blog , vậy tai sao chúng ta không dùng chương trình chia sẻ doanh thu cho từng tác giả với bài viết của họ nhỉ.Làm như thế nào và làm sao thì chúng ta hãy theo dõi các bước này nhé.





Bước 1:
Đăng nhập tài khoản blogger của bạn,  vào bảng điều kiển ---> thiết kế---> chỉnh sửa html. Check vào cái ô Mở rộng Mẫu Tiện ích
Bước 2:
Tìm đoạn code sau :
<data:post.body/>
Bước 3:
Add đoạn code sau vào bên trên hoặc bên dưới vào đoạn code vừa tìm được , tùy trường hợp bạn làm sao cho thích hợp.
<b:if cond='data:blog.pageType == "item"'>

<b:if cond='data:post.author == "Author1"'>
PASTE THE ADSENSE CODE FOR AUTHOR 1
</b:if>

<b:if cond='data:post.author == "Author2"'>
PASTE THE ADSENSE CODE FOR AUTHOR 2
</b:if>

<b:if cond='data:post.author == "Author3"'>
PASTE THE ADSENSE CODE FOR AUTHOR 3
</b:if>

</b:if>
ở đây các bạn nên dùng ADSENSE của google thì nó hay hơn và cũng dễ sử dụng. Thay "Author 1", "Author 2", "Author 3", thành tên của tác giả bài viết , lưu ý thay PASTE THE ADSENSE CODE FOR AUTHOR thành ADSENSE CODE của các tác giả.

Chúc các bạn thành công

Sep 22, 2011

Sự kiện mở đầu : Box âm nhạc yêu thương

Âm nhạc yêu thương
Âm nhạc luôn luôn tồn tại trong thế giới con người , bạn hãy cứ nghĩ cuộc đời không có âm nhạc , liệu có tình yêu không , có cảm xúc hay không. Yolks mở Box này chỉ muốn các bạn có thể gửi gắm những cảm xúc , bất kể là giận dữ , buồn phiền ( trong tình yêu ) thì bạn hãy để lại đây , và trở về nhà trong sự thanh thản..






1.Mục đích:
Như đã nói , quá khứ không thể chấp nhận trong cuộc sống khi các bạn chỉ biết nhìn lại sau lưng mà không biết tiến về phía trước. Tại sao không nhừng những bài nhạc , những câu ca yêu thương của cộng đồng blogger thân thiện của chúng tôi đến với âm nhạc nhỉ.
2.Hãy gửi gắm yêu thương:
Tại sao là phải gửi gắm yêu thương của bạn ? Bạn không được 1 sự chia sẻ từ gia đình , tại sao bạn không đến box nhạc này , không những có thể giảm tải bộ não , chúng ta còn có thể gửi gắm lại tất cả âu lo muộn phiền trên web chúng tôi . Và đem lại sự vui vẻ , lạc quan cho con người bạn , gia đình của bạn.
3.Gửi gắm như thế nào?
Bạn hãy vào link sau: http://www.vngreenzone.com/p/contact.html hoặc comment tại bài viết theo nội dung sau:
  • 1.Tên bài hát
  • 2.Người gửi
  • 3.Người nhận
  • 4.Thông diệp

Bắt đầu thôi


Theo thứ tự lời gửi gắm
1.Không lối thoát
Yolks dành tặng bạn Minh Quân ( ictsoft.net).
P/s:Chúc Quân suy nghĩ kĩ về tình cảm của mình
-----------------------------------------------
1.Tên bài hát: Mệnh lệnh hoa hồng
2.Người gửi:Biết ta là ai ùi đó
3.Người nhận:Mèo hoang
4.Thông điệp: Nhớ lời bài hát nhé! chị em mình còn nhiều nhiều thử thách để cùng nhau vượt qua. yêu em nhiều.P/s: ta sẵn sàng nhận những lời góp ý chân thành nhất từ nhà ngươi, Mèo à.
----------------------------------------------
Song:Những điều nhỏ nhoi
FR: ...
TO: Tí
SMS:Thiệt tình là ghét cái cách nhà ngươi đối xử tốt với tất cả mọi người. Điều đó chẳng khác nào như thể là ta cũng như mọi người khác. Thế nên, ra lệnh cho ngươi đừng như thế, để rồi đến lúc có kẻ nào đó như ta lại cảm thấy khó bình thường với nhà ngươi được.
Cũng thấy giận ngươi kinh, có kẻ xấu xui ta phải nói ra những gì mình muốn nói cho nhẹ lòng, mà nghĩ lại, thì hình như ta hết giận ngươi ùi. Một chút gì đó khó chia sẻ như hai người bạn như lúc xưa. Thôi thì, cố gắng nhé! Thân. Nghe nhạc vui!
---------------------------------------------
1.Tên bài hát:Cảm ơn tình yêu
2.Người gửi: Ubanks
3.Người nhận:Cộng đồng Blogger Việt
4.Thông diệp:Cảm ơn blooger, cảm ơn mọi người !
---------------------------------------------
1.Tên bài hát: I Lay My Love On You - trình bày WestLife
2.Người gửi: Me
3.Người nhận: Người mình thích
4.Thông diệp: Hãy đón nhận tình cảm của mình.
---------------------------------------------
Tên bài hát: Kem dâu tình yêu
Người gửi: Em Dung
Người nhận: Anh Linh
Thông điệp: Anh có nhớ đây là bài hát đầu tiên mà anh hát cho em nghe không? Chúng ta hãy cũng cảm ơn Yolks đã giúp chúng ta có cơ hội cùng nhau nghe ca khúc và giúp em gửi ca khúc và thông điệp này tới anh nhé! I Love You!

Sep 8, 2011

Các chương trình thiết kế cho 1 blogger

Xcode
Làm blog chắc ai cũng muốn giao diện của mình gây được ấn tượng với người xem , visit . Nhưng để được sự thật như thế chúng ta phải có nhiều công cụ và  chương trình viết code hỗ trợ. Hôm nay Yolks xin bật mí nhiều công cụ cho anh chị em blogger chúng ta sẽ dễ dàng trong thiết kế giao diện.






 1. Thiết kế về đồ họa:
Chương trình mạnh bạo nhất trong mạnh bạo là Photoshop ( PTS) , với phiên bản vượt trội CS5 thì mức thẩm mĩ của blog sẽ tăng lên đáng kể đấy.
Photoshop resources
Tính năng mới của Photoshop CS5
- Tạo hiệu ứng tuyệt đẹp cho bức ảnh. Công cụ Meeks bàn chải "cho phép bạn pha trộn màu trực tiếp trên bức hình, thiết lập các thông số khác nhau để thực hiện các nét cọ thực tế, màu sắc bảng màu trên màn hình, và nhiều tính năng khác.
- Cải thiện thêm nhiều tính năng giúp làm việc với các đối tượng 3D, vật liệu...
- Hình ảnh trực quan, thoải mái trong thiết kế.
- Làm việc với các công cụ tiên tiến nhất để xử lý hình ảnh RAW chất lượng cao.
Và nhiều tính năng khác...
Phiên bản Adobe Photoshop CS5 có lẽ là một đột phá mới của hãng Adobe, mà một chuyên gia photoshop khó có thể cưỡng lại:)

Download Free Adobe Photoshop CS5 Full
http://www.mediafire.com/?12li2kfo7x5iu

Firework cs5

Adobe Fireworks CS5 cho phép bạn tạo các ảnh đồ họa tối ưu ấn tượng cho web hay bất kì thiết bị nào — từ Smartphone đến các ki-ốt hiển thị. Tạo ra trang web, giao diện người dùng, cùng các mẫu hình chỉnh sửa được cả ở dạng vector lẫn bitmap.
Có gì mới trong Fireworks CS5
Nhiều cải thiện hiệu năng mở rộng
Cải thiện hiệu quả với tốc độ tăng cường, bộ công cụ đồ họa cập nhật, cùng khả năng kiểm soát tốt hơn vị trí pixel.
Dựng hình với độ chuẩn xác mức pixel
Tính năng dựng hình chuẩn pixel giữ cho các bản thiết kế luôn hiển thị rõ ràng trên màn hình bất kể kích cỡ.
Hoạt động liên thông với các ứng dụng Adobe Flash
Xuất các đối tượng, trang hay toàn bộ tài liệu ra ứng dụng Adobe Flash qua FXG nhằm tăng cường tương tác.
Thiết kế mẫu
Lưu các dự án thường dùng thành mẫu thiết kế để chia sẻ với nhóm thiết kế.
Hỗ trợ Adobe Swatch Exchange
Hợp màu chuẩn xác với các thiết kế từ các Phần mềm tại ChợĐiệnTử – eBay Việt Nam”
phần mềm đồ họa Adobe khác với Adobe Swatch Exchange.
Thiết kế toàn bộ trang web
Tạo mẫu trong Fireworks sau đó xuất ra các bố cục CSS tiêu chuẩn hoàn chỉnh trong Dreamweaver.
Tích hợp với Adobe Device Central
Khởi động các dự án di động tự tin với các mẫu hồ sơ thiết bị trong Adobe Device Central.
Những cải tiến mở rộng
Tùy biến các mã cho phép xuất, xử lý hàng loạt cùng các định dạng FXG với giao diện lập trình ứng dụng (API) mở rộng.

Hướng dẫn cài đặt:
1. Chạy setup, chọn Install this product as a trial
2. Chạy keygen, ấn Patch Hosts File
3. Điền tên vào Name và chọn Adobe Master Collection CS5
4. Bật Adobe Fireworks CS5, chọn Provide a serial number và điền Serial ở Keygen vào sau đó ấn Continue.
5. Tận hưởng thành quả.
 Note: Nếu bạn gặp lỗi Invalid Serial Number thì thêm dòng sau vào file hosts (C:\WINDOWS\System32\drivers\etc\hosts)

127.0.0.1 activate.adobe.com
Thêm dãy số này vào mục hosts.

Note: với mục này banner của Vnblogspot.com đã thật sự được tô điểm tăng thêm vẻ đẹp blog.
 Ngoài ra, các bạn hãy tìm hiểu thêm như Adobe Dreamweaver CS5 , Adobe Illustrator CS5, Adobe InDesign CS5 Final , Adobe Flash Professional CS5.
2.Chỉnh sửa css:
Với css chúng ta có các phần mềm sau : 

Simple CSS

Css Editor

Đây là 1 chương trình dễ sử dụng, Simple CSS cho phép bạn dễ dàng tạo ra Cascading Style Sheets đẹp mắt , có thể chỉnh sửa  mọi thứ đặt biệt thích ứng với mọi hệ điều hành Mac, Windows và Linux.

Stylizer Css Editor
Css Editor skybound
Chương trình như 1 trình duyệt  gồm chrome , firefox 3.6 --> 4.0 , ie 7 ,8 , 9 rất thích hợp cho chúng ta thiết kế tương thích với chúng.
Macrabbit
Css editor for mac
Thiết kế đẹp, sáng tạo và nhanh chóng tải các trang web ... với một ứng dụng đẹp, sáng tạo và nhanh chóng,. Phương pháp tiếp cận trực quan CSSEdit  với  phong cách và tính năng xem trước mạnh mẽ sẽ làm cho bạn cung cấp các trang web dựa trên các tiêu chuẩn tuyệt vời để tiết kiệm thời gian của bạn  
3.Chỉnh sửa xml:
Notepad ++:
Notepad
Hầu như đã quen thuộc với mọi người nhỉ . Ở đây Yolks ko đề cập nữa
EditPlus
Edit Plus 3.0 là phần mềm đa tính năng thay thế cho công cụ Text hay Notepad của Windows, cho phép sửa nhiều loại file, hỗ trợ tốt tiếng việt và chứa nhiều công cụ khác cho bạn tạo và chỉnh sửa 1 file như ý muốn.
Edit plus
 Các tính năng:
Đánh dấu ngữ pháp
EditPlus cung cấp tính năng đánh dấu ngữ pháp rất mạnh mà lại dễ dàng tùy biến, mặc định hỗ trợ các ngôn ngữ HTML, CSS, PHP, ASP, Perl, C/C++, Java, JavaScript và VBScript. Không những thế, bạn còn có thể tự tạo những file ngữ pháp để hỗ trợ cho những ngôn ngữ lập trình khác.
Các tính năng hỗ trợ Internet
- Trình duyệt web tích hợp cho phép duyệt trước nội dung các file HTML hoặc Java Applet mà không cần chuyển qua ứng dụng khác. Cửa sổ trình duyệt hỗ trợ những lệnh trên các trình duyệt thông thường nên bạn có thể lướt web dễ dàng như xem các file HTML trên máy của mình.
- Tập lệnh FTP cho phép upload các file trên máy của bạn lên má chủ FTP hoặc chỉnh sửa các file từ xa.
- Đánh dấu địa chỉ URL & email trong văn bản cho phép bạn kích hoạt ngay bằng phím F8 hoặc giữ Ctrl và nhấn đúp chuột.
HTML toolbar
HTML Toolbar cho phép chèn những thẻ HTML thường gặp một cách nhanh chóng và dễ dàng. Nó còn có những công cụ rất tuyệt như HTML Color Picker, Character Picker, Table Generator và Object Picker.
Document Selector
Document Selector cho phép dùng chuột để truy nhập tất cả các cửa sổ văn bản đang mở, nhanh hơn nhiều so với chọn trên menu Window hay ấn Ctrl+Tab nhiều lần.
Các công cụ hỗ trợ người dùng
EditPlus hỗ trợ các công cụ do người dùng tạo ra, cung cấp các file trợ giúp cũng như các file ghi lại thao tác trên bàn phím. Kết quả khi sử dụng một công cụ nào đó được đưa vào cửa sổ Output Window, nên bạn chỉ cần nhấn đúp vào dòng lệnh bị lỗi là sẽ tự động mở file và chuyển con trỏ đến dòng đó.
Auto-completion
Auto-completion là tính năng tiết kiệm thời gian sẽ chuyển các chữ viết tắt ngắn sang thành một xâu đầy đủ. Mặc định hỗ trợ các ngôn ngữ Perl và C/C++. Bạn còn có thể tự tạo file auto-completion để hỗ trợ những ngôn ngữ khác.
Cửa sổ cliptext
Cửa sổ cliptext có chứa nhiều đoạn text cho phép bạn sử dụng nhanh chóng và tiện lợi. Bạn có thể tinh chỉnh lại, và cũng có thể tự tạo cho mình các file cliptext.
Mẫu văn bản
Cung cấp nhiều mẫu văn bản cho phép bạn nhanh chóng bắt đầu soạn thảo với mẫu văn bản có sẵn.
Các tính năng khác
Đánh số dòng, thước căn, cột chọn, tìm và thay thế, hỗ trợ undo/redo nhiều lần, kiểm tra chính tả, các phím tắt...
Download:
http://www.mediafire.com/?0qkwmydnnmm

Sep 2, 2011

Tạo float search form cho blogger

float search form
Hôm nay 2/9 , Yolks có 1 thủ thuật ngon và mới lạ cho ae blogger của chúng ta xài , như bài viết trước
Thì hôm nay Yolks đã nghĩ ra được 1 thủ thuật mới lạ , không kém phần độc đáo.Chúc đã hãy xem tiếp nhé








Hầu như các thủ thuật float đầu sử dụng .js ( điều này ai cũng bỡ ngỡ) nhưng sự thật float có thể sử dụng vài mã css là xong.
1.Tạo bố cục bằng css:

.timkiemvds{
position:fixed;
top:36px;
left:-210px;
transition: all 3s ease-out; -webkit-transition: all 3s ease-out; -moz-transition: all 3s ease-out;
transition-delay: 3s; -webkit-transition-delay: 3s; -moz-transition-delay: 3s;
}
.timkiemvds:hover{
left:0px;
transition: all 1s ease-out; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out;
}
.timkiemvds div.timkiem_1{
padding:14px 0 0 29px;
width:276px;
height:50px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl2naXs12BTkjkf9nGsGn5ajyudsjN6N7izIU4KfHSyXQyxKoHqUj2oYBs4lCXLNrwaO352byZJzFSI6eRP3qHC7yjVcag7KBH9oJyJwffvOq9RBKEUhzs3JxGhfdPgu3W_fKwyKOvkSQ/s1600/find10.png) top left no-repeat;
}
.timkiemvds div.timkiem_congcu{
position:relative;
overflow:hidden;
padding:5px;
left:35px;
width:153px;
height:10px;
background-color:#ffa200;
color: #ffffff;
border:1px solid #8A8A8A;
box-shadow: 3px 3px 3px #8A8A8A;
transition: all 1s ease-out; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out;
transition-delay: 1s; -webkit-transition-delay: 1s; -moz-transition-delay: 1s;
}
.timkiemvds:hover div.timkiem_congcu{
height:150px;
transition: all 1s ease-out; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out;
transition-delay: 1s; -webkit-transition-delay: 1s; -moz-transition-delay: 1s;
}
.noidungtimkiem{background-color:transparent; border:0; width:178px; height:20px;}
.submittimkiem{width:50px; background-color:transparent; border:0; cursor:pointer;}

Ok con dê ! chúng ta tiếp tục với phần code thôi
2.Chèn code vào blog:
Chèn sau thẻ :
<div class='gensmall'>
<form action='/search' id='searchform' method='get' target='_blank'>
<div class='timkiemvds'>
<div class='timkiem_1'>
<input class='noidungtimkiem' id='s' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Search my site...&quot;;}' onfocus='if (this.value == &quot;Search my site...&quot;) {this.value = &quot;&quot;}' type='text' value='Search my site...'/>
<input class='submittimkiem' type='submit' value=''/>
</div>
<div class='timkiem_congcu'>
<center><strong>CÔNG CỤ TÌM KIẾM</strong></center>
</div>
</div>
</form>
</div>
3.Save lại
Lưu ý chúng ta có thể chỉnh thời gian chậm hoặc nhanh ở css nhé chỗ nào có 1s hay 3s các bạn hãy chỉnh theo ý thích nhé