五
16
7月
2010
960淘宝客专用模板
很多淘宝客都想有一强大淘宝类网站作产品推广,其实这愿望很容易在JIMDO建站实现,这里有免费的空间给你展示和推广你的产品,通过学习一些简单的建站知识,你就可以拥有属于自己的网站,下面是一个960宽的淘宝模版,适合淘宝网上的各个频道展示。
HTML代码
<div id="container">
<center>
<div id="header">
<a href="http://zhuti.huoban.taobao.com/event.php?pid=mm_14188710_0_0&eventid=100121"
target="_blank"><img src="header.jpg" alt="" /></a>
</div>
</center>
<div id="navigation">
<var>navigation[1|2|3]</var>
</div>
<table style="WIDTH: 960px; HEIGHT: 33px" cellspacing="2" cellpadding="3" width="950" align="center" bgcolor="#FFFFFF"
border="0">
<tbody>
<tr>
<td>
<p align="center">
 <font
color="#FF0000" size="2">网购必看:本站是一个网上购物信息导航网,精心为您搜寻淘宝网上最新、最全、最优惠的购物资讯,让您享受网购一站式的服务......<a href="http://13580.jimdo.com/013" target=
"_blank">详细>></a></font>  <a onclick="window.external.AddFavorite('http://13580.jimdo.com', '千回百转网'); return false;" href="#"><font
color="#191970">收藏本站</font></a>
<a
onclick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://13580.jimdo.com'); return false;" href="#"><font color="#191970">设为首页</font></a>
</p>
</td>
</tr>
</tbody>
</table>
<div id="content">
<var>content</var>
</div>
<table width="960" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td width="180" height="355" align="right">
<div id="sidebar">
<var>sidebar</var>
</div>
</td>
<td width="760" height="355">
<table style="background-color: border-color: border-width:1px;"
border="0" width="100%">
<tbody>
<tr>
<td>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td>
<a href="http://cam.taoke.alimama.com/event.php?pid=mm_14188710_0_0&eventid=100889"
target="_blank"><img src=
"http://img.alimama.cn/topicfile/2009-07-21/10088909392104390417.jpg" alt="" /></a>
</td>
</tr>
<tr>
<td>
<a href="http://cam.taoke.alimama.com/event.php?pid=mm_14188710_0_0&eventid=100745"
target="_blank"><img src=
"http://img.alimama.cn/topicfile/2009-06-19/12453749211260.jpg" alt="" /></a>
</td>
</tr>
<tr>
<td>
<a href="http://cam.taoke.alimama.com/event.php?pid=mm_14188710_0_0&eventid=100913"
target="_blank"><img src=
"http://img.alimama.cn/topicfile/2009-07-31/10091309303102300716.jpg" alt="" /></a>
</td>
</tr>
<tr>
<td>
<div id="links">
<h4>
<font color="#D71418">友情链接</font>
</h4>
<div class="links_list l">
<h4 style="color:red;">
<script type="text/javascript" src="http://js.tongji.linezing.com/1532782/tongji.js">
</script><noscript><a href="http://www.linezing.com"><img src="http://img.tongji.linezing.com/1532782/tongji.gif" alt="" /></a></noscript>   <a href="http://www.taobao.com/"
target="_blank">淘宝网</a>    <a href="http://club.alimama.com" target="_blank">阿里妈妈论坛</a>   <a
href=
"http://www.eachnet.com/">易趣网</a>   <a href="http://www.chinadrtv.com"
target="_blank">橡果国际</a>   <a href=
"http://youa.baidu.com/" target="_blank">百度有啊</a>   <a href="http://home.dangdang.com/"
target="_blank">当当网</a>  
<a href="joyo" _mce_href="http://www.amazon.cn">joyo">http://www.amazon.cn">joyo卓越</a>   <a href="http://www.taobao600.com/" target="_blank">淘宝600家园</a>   <a href=
"http://china.alibaba.com/" target="_blank">阿里巴巴</a>   <a href="http://www.hsw123.com/"
target="_blank">好上网</a>
  <a href="http://eladies.sina.com.cn/">新浪女性</a>   <a href="http://www.rayli.com.cn/" target=
"_blank">瑞丽女性网</a>   <a href="http://jdm.jimdo.com/" target="_blank">网上邻居的博客</a>   <a
href="http://hsw123.jimdo.com/"
target="_blank">摄影blog123</a>  
</h4>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
<div id="footer">
<div class="gutter">
<var>footer</var>
</div>
</div>
</div>
CSS代码
/* Typo
----------------------------------------------- */
a:link, a:visited
{
text-decoration: underline;
color:#EC4413;
}
a:active { text-decoration: underline; }
a:hover { text-decoration:none; }
h1 { font:bold 18px/140% "Trebuchet MS", Verdana, sans-serif; }
h2 { font:bold 14px/140% "Trebuchet MS", Verdana, sans-serif; }
p { font: 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif;}
/* Layout
----------------------------------------------- */
body {
background:#ff69b4;
padding:35px 0 0 0;
margin:0;
font: 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#container
{
margin:0 auto;
width:980px;
background:white;
}
#header
{
padding:5px;
}
#header h1,
#header a
{
padding:0;
font-family:"Helvetica","Lucida Sans Unicode",Tahoma,Verdana,Arial,Helvetica,sans-serif;
font-size:30px;
font-weight:normal;
text-decoration:none;
line-height:1.3em;
color:#666666;
text-align:right;
}
#header a:hover { text-decoration:none; }
#navigation
{
float:left;
width:960px;
padding-left:5px; padding-right:5px;
background: url(navbg.png) #c50;
}
#sidebar
{
padding-top:10px;
}
#content
{
float:right;
width:960px;
padding:5px;
}
#footer
{
clear:both;
margin-top:10px;
background:url(footer-bg.gif) repeat-x top;
height:120px;
}
#footer .gutter
{
height:30px;
padding:35px 15px 0 90px;
}
/* Navigation
----------------------------------------------- */
ul.mainNav1,
ul.mainNav2
{
margin:0;
padding: 0;
}
ul.mainNav1 li,
ul.mainNav2 li
{
float:left;
margin: 0;
padding: 0;
list-style:none;
}
ul.mainNav1 li a,
ul.mainNav2 li a
{
font:normal 12px/160% 宋体;
text-decoration: none;
display:block;
border-right:1px solid #fff;
color:#fff;
}
ul#mainNav1 li a { padding:6px 10px 6px 10px; }
ul#mainNav1 a:hover{color:#0f0;}
ul#mainNav1 a.current { font-weight:bold; color:#0f0;}
ul.mainNav1 a:hover
{
background:#EEE;
color:black;
}
ul.mainNav1 a.current { font-weight:bold; }
.blogselection .clearover
{
border-bottom: 1px dashed #00f;
}
模版预览地址:http://13580.jimdo.com/
补充:
HTML代码部分要修改一下:黄色部分是头部图片,更换一张自己喜欢的.红色部分是一行网站说明文字可适当修改,另外收藏、设主页要改成自己网站的地址。绿色部分是广告合的右侧空白填充部分,有三张图片和一个友情链接,也要进行适当修改。
CSS代码基本不用改,如果你对编程有一定了解可以更改一下其中内容,使网站更美观,更有个性。


