Demo Và Download botton
Chào các bạn!
Đối với một blog chuyên về tài liệu và lưu trữ thì việc chèn một nút Demo và Download là hoàn toàn cần thiết, blog sẽ trông đẹp và gọn gàng hơn nhiều, hơn nữa lợi ích của việc chèn botton thể loại này không làm giảm tốc độ load trang. Ngay sau đây toptienich sẽ hướng dẫn các bạn cách thực hiện.
Cách làm
Bước 1: Bạn coppy và chèn đoạn mã sau lên trước thẻ ]]></b:skin>
 /* CSS Simple Button */ #wrap { margin:20px auto; text-align:center; } #wrap br { display:none; } .btn { display:inline-block; position:relative; font-family:'Source Sans Pro', Helvetica, sans-serif; background:#fff ; padding:10px 14px; font-size:14px; margin:0 3px; color:#fff !important; border-radius:3px;border:none; text-transform:uppercase; text-decoration:none; transition:all 0.3s ease-out;border:#F20000 3px solid } .btn.down { background:#fff ; color:#F20000 !important; } .btn.down:hover,.btn.down:active,.btn:hover,.btn:active { background:#333; color:#fff ; } a.btn.down:hover,a.btn.down:active,a.btn:hover,a.btn:active { color:#F20000 ; } .btn i { margin-left:10px; font-weight:normal; font-family:FontAwesome; } .quickedit{ display:none; }
Bước 2: Lưu mẫu
Bước 3: Chèn mã sau vào bài viết, nơi mà các bác muốn xuất hiện nút Demo và Download
<div id="wrap"> <a class="btn down" href=" Links Demo " rel="nofollow" target="_blank"> Demo <i class="fa fa-paper-plane"></i></a><br /> <a class="btn down" href=" Links Download" rel="nofollow" target="_blank">Download <i class="fa fa-file"></i></a></div>