Footer giống Tinh Tế (cũ)

PVS · 15/07/2015

Footer giống Tinh Tế (cũ)

Bắt đầu:

Vào AdminCP -> template -> Tìm footer chèn cái này vào Footer

Mã:

<xen:edithint template="footer.css" />
<xen:hook name="footer">
<div class="footer_main_bot">
    <div class="pageWidth">
        <div class="pageContent">
            <ul class="menu">
                <li class="menu_title"><h3>Tinhte.vn</h3></li>
                <li><a href="#">Trang nhất</a></li>
                <li><a href="#">Diễn đàn</a></li>
                <li><a href="#">Video công nghệ</a></li>
                <li><a href="#">Wiki Thiết bị</a></li>
                <li><a href="#">Mua bán - Rao vặt</a></li>
                <li><a href="#">Hướng dẫn</a></li>
                <li><a href="#">Liên hệ</a></li>
            </ul>
            <ul class="menu">
                <li class="menu_title"><h3>Diễn đàn</h3></li>
                <li><a href="#">Tin tức</a></li>
                <li><a href="#">Khuyến mãi</a></li>
                <li><a href="#">Windows</a></li>
                <li><a href="#">Mac OS</a></li>
                <li><a href="#">Linux</a></li>
                <li><a href="#">Máy ảnh số</a></li>
                <li><a href="#">Máy quay phim</a></li>
            </ul>
            <ul class="menu">
                <li class="menu_title"><h3>Diễn đàn</h3></li>
                <li><a href="#">iOS</a></li>
                <li><a href="#">Android</a></li>
                <li><a href="#">Windows Phone</a></li>
                <li><a href="#">BlackBerry</a></li>
                <li><a href="#">Symbian</a></li>
                <li><a href="#">Bada</a></li>
                <li><a href="#">Meego</a></li>
            </ul>
            <ul class="menu">
                <li class="menu_title"><h3>Diễn đàn</h3></li>
                <li><a href="#">Palm</a></li>
                <li><a href="#">Điện thoại Nhật</a></li>
                <li><a href="#">Điện thoại phổ thông</a></li>
                <li><a href="#">Phát triển phần mềm</a></li>
                <li><a href="#">Mạng di động</a></li>
                <li><a href="#">Internet</a></li>
                <li><a href="#">Công nghệ 3G, 4G</a></li>
            </ul>
            <ul class="menu">
                <li class="menu_title"><h3>Diễn đàn</h3></li>
                <li><a href="#">GPS</a></li>
                <li><a href="#">Server</a></li>
                <li><a href="#">Thiết bị ngoại vi</a></li>
                <li><a href="#">Điện tử, tiêu dùng</a></li>
                <li><a href="#">Máy đọc sách</a></li>
                <li><a href="#">Phương tiện</a></li>
                <li><a href="#">Khoa học công nghệ</a></li>
            </ul>
            <ul class="menu">
                <li class="menu_title"><h3>Liên kết &amp; hợp tác</h3></li>
                <li><a href="#">Cafe Tinh tế</a></li>
                <li><a href="http://www.facebook.com/" title="Tinhte.vn trên Facebook" target="_blank">Tinhte.vn Facebook</a></li>
                <li><a href="http://www.twitter.com/" title="Theo Tinhte.vn trên Twitter" target="_blank">Tinhte.vn Twitter</a></li>
                <li><a href="http://www.khacten.com/" title="Bao da, miếng dán da" target="_blank">Khacten.com</a></li>
                <li><a href="http://www.1tudien.com" title="Từ điển trực tuyến" target="_blank">1TuDien.com</a></li>
                <li><a href="http://www.nhaccuatui.com" title="Nghe nhạc mọi lúc mọi nơi" target="_blank">Nhaccuatui.com</a></li>
                <li><a href="http://www.chodientu.vn" title="Mua hàng trực tuyến" target="_blank">Chodientu.vn</a></li>
            </ul>
        </div>
    </div>
</div>
</xen:hook>

Chèn đoạn code sau vào footer.css

Mã:

.footer_main_bot {
    background: none repeat scroll 0 0 #34393E;
    border-top: 1px solid #474C50;
    padding: 20px 0;
}
.footer_main_bot .pageContent {
}
.footer_main_bot .pageContent:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
.footer_main_bot .menu {
    float: left;
    list-style: none outside none;
    margin: 0;
    padding: 10px;
    width: 140px;
}
.footer_main_bot .menu .menu_title h3 {
    color: #98CCE6;
    font-size: 16px;
}
.footer_main_bot .menu a {
    color: #F1F9FB;
    line-height: 24px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.7);
}

Vào extra.css thêm:

Mã:

.footer_main_bot{background:#34393e;border-top:1px solid #474c50;padding:20px
0}.footer_main_bot
.pageContent{zoom:1}.footer_main_bot .pageContent:after{content:'.';display:block;height:0;clear:both;visibility:hidden}.footer_main_bot
.menu{float:left;width:140px;margin:0;padding:10px;list-style:none}.footer_main_bot .menu .menu_title
h3{font-size:16px;color:rgb(152, 204, 230)}.footer_main_bot .menu
a{line-height:24px;color:rgb(241, 249, 251);text-shadow:0 -1px 0 rgba(0,0,0,.7)}