求助 htm问题

潜水学习 · 发表于 2008-5-17 20:18:30

我的博客首页导航栏浏览器顶上与产生分离！我需要的不是这种效果！

原本很好，但是一加上背景图片就是产生这种分离效果

首页源文件

头部部分

<html><head><meta http-equiv=Content-Type content="text/html;charset=gb2312"><title>雪深的blog -------那年雪下的很深</title>
<meta name="keywords" content="各种音效，经典网页背景音乐，网页素材下载，flash欣赏下载，建站源码,网站建设技术，风景flash，flash模板，古典美女电脑技术，">
<meta name="description" content="素材下载，flash欣赏下载，建站源码，电脑技术，建站交流,各种音效">
</head>

复制代码

导航栏代码

<style type="text/css">
<!--
body {
background: #FFF;
color: #000;
font: 12px Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
a:link, a:visited {
color: #FF2A84;
text-decoration: underline;
}
a:hover, a:active {
color: #FFF;
text-decoration: none;
background: #FF2A84;
}
#navigation {
background: #DDD;
border-bottom: 1px solid #A1A1A1;
margin: 1em 0 0;
padding: 0.6em 0 0;
font-weight: bold;
}
#navigation ul, #navigation ul li {
list-style: none;
margin: 0;
padding: 0;
}
#navigation ul {
padding: 5px 0 5px;
text-align: center;
}
#navigation ul li {
display: inline;
}
#navigation ul li a {
background: url(tableft.gif) no-repeat left top;
color: #FFF;
text-decoration: none;
padding: 5px 0;
}
#navigation ul li span {
background: url(tabright.gif) no-repeat right top;
padding: 5px 7px 5px 3px;
margin: 4px 0 4px 4px;
}
#navigation ul li a:hover span {
text-decoration: underline;
background-position: 100% -75px;
}
#navigation ul li a:hover {
background-position: 0 -75px;
}
#navigation #current a {
background-position: 0 -150px;
}
#navigation #current a span {
background-position: 100% -150px;
}
/*- Internet Explorer...It's Hacktastic!--------------------------- */
/*\*//*/
#navigation ul li a {
display: inline-block;
white-space: nowrap;
width: 1px;
}
#navigation ul {
padding-bottom: 0;
margin-bottom: -1px;
}
/**/
/*\*/
* html #navigation ul li a {
padding: 0;
}
/**/
-->
</style>
</head>
<body>
<div id="navigation">
<ul>
<li><a href="index.htm"><span>首页</span></a></li>
<li><a href="xueshen/xinwen.htm"><span>新闻</span></a></li>
<li><a href="xueshen/rizhi.htm"><span>日志</span></a></li>
<li><a href="xueshen/tupian.htm"><span>图片</span></a></li>
<li id="current"><a href="xueshen/shipin.htm"><span>视频</span></a></li>
<li><a href="xueshen/shenghuo.htm"><span>生活</span></a></li>
<li><a href="logo"><span>邮箱logo制作</span></a></li>
<li><a href="xueshen/sucai"><span>素材下载</span></a></li>
<li><a href="xueshen/ruanjian"><span></span>源码下载</a></li>
<li><a href="xueshen/youqing.htm"><span>友情连接</span></a></li>
<li><a href="xueshen/qita.htm"><span>其它</span></a></li>
<li><a href="xueshen/liuyan"><span>给我留言</span></a></li>
<li><a href="xueshen/mingyan"><span>很多名言 </span></a></li>
</ul>
</div>
</body>

复制代码

js特效边框

<script language="JavaScript1.2">
if (document.all)
document.body.style.cssText="border:25 ridge off-white"
</script>

复制代码

潜水学习 · 发表于 2008-5-17 20:19:59

雪景特效js

<script language="JavaScript">
<!--
Amount=20; //Smoothness! depends on image file size, the smaller the size the more you can use!
//Pre-load your image below!
Image0=new Image();
Image0.src="sto/flake1.gif";
Image1=new Image();
Image1.src="sto/flake2.gif";
Image2=new Image();
Image2.src="sto/flake3.gif";
Image3=new Image();
Image3.src="sto/flake4.gif";
Image4=new Image();
Image4.src="sto/flake5.gif";
grphcs=new Array(5)
grphcs[0]="xueshen/xuehua/1.gif"
grphcs[1]="xueshen/xuehua/2.gif"
grphcs[2]="xueshen/xuehua/3.gif"
grphcs[3]="xueshen/xuehua/4.gif"
grphcs[4]="xueshen/xuehua/5.gif"
Ypos=new Array();
Xpos=new Array();
Speed=new Array();
Step=new Array();
Cstep=new Array();
ns=(document.layers)?1:0;
if (ns){
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write('<img id="si" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}
WinHeight=(document.layers)?window.innerHeight:window.document.body.clientHeight;
WinWidth=(document.layers)?window.innerWidth:window.document.body.clientWidth;
for (i=0; i < Amount; i++){
Ypos[i] = Math.round(Math.random()*WinHeight);
Xpos[i] = Math.round(Math.random()*WinWidth);
Speed[i]= Math.random()*3+2;
Cstep[i]=0;
Step[i]=Math.random()*0.1+0.05;
}
function fall(){
var WinHeight=(document.layers)?window.innerHeight:window.document.body.clientHeight;
var WinWidth=(document.layers)?window.innerWidth:window.document.body.clientWidth;
var hscrll=(document.layers)?window.pageYOffset:document.body.scrollTop;
var wscrll=(document.layers)?window.pageXOffset:document.body.scrollLeft;
for (i=0; i < Amount; i++){
sy = Speed[i]*Math.sin(90*Math.PI/180);
sx = Speed[i]*Math.cos(Cstep[i]);
Ypos[i]+=sy;
Xpos[i]+=sx;
if (Ypos[i] > WinHeight){
Ypos[i]=-60;
Xpos[i]=Math.round(Math.random()*WinWidth);
Speed[i]=Math.random()*5+2;
}
if (ns){
document.layers['sn'+i].left=Xpos[i];
document.layers['sn'+i].top=Ypos[i]+hscrll;
}
else{
si[i].style.pixelLeft=Xpos[i];
si[i].style.pixelTop=Ypos[i]+hscrll;
}
Cstep[i]+=Step[i];
}
setTimeout('fall()',10);
}
fall();
//-->
</script>

复制代码

滚动文字代码

<marquee scrollAmount=1 width=400 height=320 direction=up>
<font color="#000" size="4"><strong>  雪韵</strong></font>
<font color="#000" size="4"><strong>  我不能够知道
  你是否喜欢春天
  我也不能够知晓
  你是否钟情于我
  如果真的愿意
  就请飘飘而下吧
  我　　　　　　　　　
  正立于自信张开热情
  静静聆听你的倾诉</strong></font>
<font color="#000" size="4"><strong>  既然大地尚有冰封区
  就请铺下倾地棉床
  既然春天还需要滋润
  就请降雪乳以哺胚根
  既然道路还不那么平坦
  就请覆盖所有的崎岖
  既然天空还不那么透明
  就请涤去入眼的尘埃
  既然我的身上或多或少会有污点
  就请浸透我的灵魂
  既然你有那么多的人迷恋
  既然你已经飘落下来了
  就连骚客们都愿意缀你入诗 </strong></font>
</a></marquee>

复制代码

潜水学习 · 发表于 2008-5-17 20:21:40

背景图片代码

<TABLE width="100%">
<TBODY>
<TR>
<TD class=ArticleTitle align=left>
<DIV id=divTitle style="FONT-SIZE: 30px"><B></B> </DIV></TD></TR>
<TR>
<TD class=ArticleContent style="FONT-SIZE: 30px; LINE-HEIGHT: 150%" align=left>
<CENTER> </CENTER>
<STYLE type=text/css><!--body {background-image:url(bg.jpg);background-repeat:no-repeat;background-attachment:fixed;background-position:50% 50%}</STYLE>
</TD></TR></TBODY></TABLE></SPAN>

复制代码

效果可以在www.bbslianmeng.net看见！如果产生这样的分离效果很难看

潜水学习 · 发表于 2008-5-17 20:24:08

那位高手能给我解决吗

bingu · 发表于 2008-5-17 21:41:11

哈哈，知道不好看了吧。

潜水学习 · 发表于 2008-5-17 22:09:45

还说风凉话
给我个解决的办法吧

bingu · 发表于 2008-5-18 01:39:18

太乱了，我搞不定。

zerty · 发表于 2008-5-18 15:51:39

#navigation {
      background: #DDD;
      border-bottom: 1px solid #A1A1A1;
      margin: 1em 0 0;
      padding: 0.6em 0 0;
      font-weight: bold;
}

把红的地方改成一个0

潜水学习 · 发表于 2008-5-18 17:05:52

感谢.........................

bingu · 发表于 2008-5-24 21:25:59

哈哈，怎么用上bo-blog了啊

求助 htm问题

回复 5# 的帖子

z

评分

浏览过的版块