精美漂亮网站引导页模板源码

本文实例讲述了精美漂亮网站引导页模板效果代码。分享给大家供大家参考。

效果图：

具体代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"><head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>一米阳光站长资源站</title>

<meta name="keywords" content="一米阳光站长资源站">

<meta name="description" content="一米阳光站长资源站">

<script type="text/javascript" language="javascript" src="img/jquery-1.js"></script>

<link rel="stylesheet" href="img/temp.css" type="text/css">

<script type="text/javascript" src="img/jquery.js"></script>

<script type="text/javascript" language="javascript">

$(function(){

$('#taobao_ico').poshytip();

$('#hotel_ico').poshytip();

$('#travel_ico').poshytip();

$('#youxia_ico').poshytip();

});

function _load(){

var _bodyHeight =parseInt(document.documentElement.clientHeight);

var _height = parseInt(document.getElementById("footer").offsetHeight);

var _centerHeight = parseInt(document.getElementById("center").offsetHeight);

var _contentHeight = _bodyHeight - _centerHeight;

if(_contentHeight>_height){

document.getElementById('footer').style.height=_contentHeight-27+'px';

}

}

$(window).resize(function(){

_load();

});

</script>

<style id="poshytip-css-tip-yellow" type="text/css">div.tip-yellow{visibility:hidden;position:absolute;top:0;left:0;}div.tip-yellow table, div.tip-yellow td{margin:0;font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit;font-variant:inherit;}div.tip-yellow td.tip-bg-image span{display:block;font:1px/1px sans-serif;height:10px;width:10px;overflow:hidden;}div.tip-yellow td.tip-right{background-position:100% 0;}div.tip-yellow td.tip-bottom{background-position:100% 100%;}div.tip-yellow td.tip-left{background-position:0 100%;}div.tip-yellow div.tip-inner{background-position:-10px -10px;}div.tip-yellow div.tip-arrow{visibility:hidden;position:absolute;overflow:hidden;font:1px/1px sans-serif;}

body{FONT-FAMILY:"Microsoft Yahei","verdana", "Arial","宋体";font-size: 16px; }

</style></head>

<body onload="_load()">

<div id="center">

<div class="ico">

<label>

<a href="http://www.520ym.net"><img id="taobao_ico" src="img/ptb.jpg" width="130" height="60"></a>

<a href="http://www.520ym.net">点此进入</a>

</label>

<label><a href="http://www.520ym.net"><img id="hotel_ico" src="img/vip.jpg" width="130" height="60"></a>

<a href="http://www.520ym.net">点此进入</a>

</label>

<label>

<a href="http://www.520ym.net"><img id="travel_ico" src="img/zgb.jpg" width="130" height="60"></a>

<a href="http://www.520ym.net">点此进入</a>

</label>

</div>

<div class="quckLink">温馨提示：

<a style="font-size:16px; font-weight:bold;">一米阳光站长资源站，源码下载，各类站长资源，欢迎访问！</a>

</div>

</div>

<div style="height: 117px;" id="footer">

<p><a href="http://www.520ym.net/">返回首页</a><span>|</span> <a href="#">咨询电话</a></p>

<p>Copyright © 2015, 一米阳光站长资源站. <br><br>

</p>

</div>

</body></html>