Tạo khung Liên Kết Bạn Bè 3 Cột Kèm Hiệu Ứng Hover Cho Blogspot.
HƯỚNG DẪN CÁCH CHÈN:
Bước 1: Login Blogspot => Bố Cục thêm tiện ích HTML/JAVASCRIPTBước 2: Chèn đoạn code bên dưới vào trong:
<style>Bước 3: Chèn code bên dưới vào sau <head>
#lien-ket-ban-be::-webkit-scrollbar{width:5px}
#lien-ket-ban-be::-webkit-scrollbar-thumb{background:#484848;border-radius:3px}
#lien-ket-ban-be::-webkit-scrollbar-thumb:active{background:#777}
#lien-ket-ban-be{padding:0;margin:0;list-style:none}
.lien-ket-ban-be{margin:0;padding:0}
.lien-ket-ban-be ul{padding:6px 0.8px 6px 6px}
.lien-ket-ban-be li{width:33.3%;margin:0;padding:0;line-height:normal;display:block;float:left;text-align:center}
.lien-ket-ban-be a{padding-left:25px;transition: all 0.5s ease 0s;width:auto;text-overflow:ellipsis;overflow:hidden;display:block;-webkit-box-orient:vertical;-webkit-line-clamp:1;white-space:nowrap;margin:0 5px 5px 0;padding:5px;font-size:15px;font-weight:400;-webkit-transition:.3s;border-radius:3px;-moz-transition:.3s;-o-transition:.3s;color:#000;border:1px solid #e5e5e5}
.lien-ket-ban-be a:hover{color:#f90!important;border:1px solid;text-decoration:none!important}
.lien-ket-ban-be a:before{content:"\f007";font-family:"Font Awesome 5 Free";color:#00c0ef;margin-right:10px;font-size:11px;font-weight:700}
</style>
<div id='lien-ket-ban-be'>
<div class='lien-ket-ban-be'>
<ul>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a></li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href=#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a></li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<li><a href='#' target='_blank'>Đặt liên kết</a> </li>
<!--<li><a href='#' target='_blank' title='Liên kết blog'>Đặt liên kết</a></li>-->
</ul>
</div></div>
<script type='text/javascript'>Bước 4: Lưu lại là xong.
//<![CDATA[
function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
loadCSS("https://cdn.rawgit.com/hung1001/blog/master/lastest/font-awesome/css/all.css");
loadCSS("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i&amp;subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese");
//]]>
</script>
Nhận xét
Đăng nhận xét