div无故被动态改变

kaphoon 2008-03-09 10:21:26
	                
<div id='webmaster' class='box' >
<ul>
<li><a href='' target='_blank'>123456789</a></li>
<li><a href='' target='_blank'>3456789</a></li>
<li><a href='' target='_blank'>56789</a></li>
<li><a href='/member.php' target='_blank'>7890</a></li>
</ul>
</div>


症状:1.当鼠标从第四行移向第三行时,div的高度变小,再回到第四行时,div高度又恢复正常。
2.当我把第四行中的href清空(即href=''),又一切正常。

请问,这是由什么造成的?
...全文
217 20 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
20 条回复
切换为时间正序
请发表友善的回复…
发表回复
kaphoon 2008-03-21
  • 打赏
  • 举报
回复
多谢 silence2k.
在下CSS新人。自己从头写CSS对我来讲比较难,不过,我正在学习。谢谢您的提醒。

之前说,追加100分。可是结贴时,没办法给您,实在不好意思。记得以前可以在社区银行里面可以给予的,我马上就试一下!
silence2k 2008-03-21
  • 打赏
  • 举报
回复
没关系了 呵呵 以后有问题 再提 到时候顺道给点分行了
silence2k 2008-03-14
  • 打赏
  • 举报
回复
你的css 借用别人的
但应该整理下 挺乱
自己从新些
问题很容易解决
silence2k 2008-03-14
  • 打赏
  • 举报
回复

如果去掉 背景
a,
a:link,
a:active 中的 background-color: white;
那么 也不能设置 除了黑色以外的其他颜色
[怀疑:可能是在颜色变化中使<ul>中的 变色的那个<li>导致ul的高度就变化了 具体的还是没很明白]

解决办法
在 typo.css 文件中
添加
ul,ol,dl {float:left}
silence2k 2008-03-13
  • 打赏
  • 举报
回复
去掉 width: 185px;
也不会跳了
下回再看....
silence2k 2008-03-13
  • 打赏
  • 举报
回复
仔细看了看 还是发现
最根本原因 是
homepage.css中
div.box
宽度定义 有问题
width: 185px;
silence2k 2008-03-13
  • 打赏
  • 举报
回复
的确 去掉

a,
a:link,
a:active {
text-decoration: none;

color: blue;
background-color: white;
}
中的 background-color: white; 即可
silence2k 2008-03-13
  • 打赏
  • 举报
回复
在 typo.css 文件中 有问题

去掉以下 就不跳了 稍等 再看具体原因

/* LINKS */
a,
a:link,
a:active {
text-decoration: none;

color: blue;
background-color: white;
}
a:visited {
color: purple;
background-color: transparent;
}
a:hover {
text-decoration: none;

color: white;
background-color: black;
}
/* END LINKS */
kaphoon 2008-03-11
  • 打赏
  • 举报
回复
我发现,把a:hover中的background-color注释掉,就OK啦,颜色怎么会引起div高度的改变?
a:hover {
text-decoration: none;

color: white;
/*background-color: black;*/
}
  • 打赏
  • 举报
回复
你不用li和ul,你用多个DIV代替应该就不会出现这问题了
kaphoon 2008-03-11
  • 打赏
  • 举报
回复
index.php中并没有使用任何的js代码。
  • 打赏
  • 举报
回复
你不单只是一个,左边2个都不行
  • 打赏
  • 举报
回复
应该是你的JS或者别的地方影响了
单你上面贴出来的代码是没有问题的
回.到.未来 2008-03-10
  • 打赏
  • 举报
回复
这代码贴成一行没法看啊
kaphoon 2008-03-10
  • 打赏
  • 举报
回复
http://y116708.51host.net/ 左下角的那个box。

谁能解决这个问题,再追加100分!:)
kaphoon 2008-03-10
  • 打赏
  • 举报
回复
我也不想的:)
麻烦,按照四楼的方法下载文件。
谢谢!
kaphoon 2008-03-09
  • 打赏
  • 举报
回复
我用了网上的一个CSS Framework.
我用IE Developer Tool把webmaster那个div的信息输出了出来。
1. 下载文件http://uploadfile.org/download.php?id=ozVTVKkRcQ8mz7kS2pB1
2. 把后缀名改为html.

谢谢!

kaphoon 2008-03-09
  • 打赏
  • 举报
回复

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"><META http-equiv="Content-Type" content="text/html; charset=GB2312"> <HTML dir="ltr" xml:lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml"><HEAD><STYLE> /* Rule 2 of framework/typo.css */ DIV { FONT-SIZE: 1em} /* Rule 4 of framework/tools.css */ .clearfix { DISPLAY: inline-block} /* Rule 5 of framework/tools.css */ .clearfix { DISPLAY: block} /* Rule 2 of framework/layout-navtop-localleft.css */ DIV#main { DISPLAY: inline; FLOAT: right; WIDTH: 500px} /* Rule 7 of framework/layout.css */ DIV#main { } /* Rule 4 of /css/homepage.css */ DIV#main { MARGIN-TOP: 50px; DISPLAY: inline; FLOAT: left; WIDTH: 95%} /* Rule 1 of framework/layout-navtop-localleft.css */ DIV#content { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px auto 20px; WIDTH: 701px; PADDING-TOP: 0px; POSITION: relative; TEXT-ALIGN: left} /* Rule 6 of framework/layout.css */ DIV#content { } /* Rule 3 of /css/homepage.css */ DIV#content { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 0px 20px; WIDTH: 95%; PADDING-TOP: 0px; POSITION: relative; TEXT-ALIGN: left} /* Rule 2 of framework/layout.css */ DIV#page { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: white; PADDING-BOTTOM: 0px; MARGIN: 0px auto; WIDTH: 90%; PADDING-TOP: 0px; TEXT-ALIGN: center} /* Rule 1 of framework/typo.css */ BODY { FONT-SIZE: 76%; COLOR: #333; LINE-HEIGHT: 1em; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; TEXT-ALIGN: left} /* Rule 1 of framework/layout.css */ BODY { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: white; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; TEXT-ALIGN: center} /* Rule 1 of /css/homepage.css */ DIV.box { BORDER-RIGHT: #a8bacd 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #a8bacd 1px solid; PADDING-LEFT: 1px; MARGIN-BOTTOM: 10px; PADDING-BOTTOM: 1px; MARGIN-LEFT: 1px; BORDER-LEFT: #a8bacd 1px solid; WIDTH: 185px; PADDING-TOP: 1px; BORDER-BOTTOM: #a8bacd 1px solid; POSITION: relative} /* Rule 23 of framework/typo.css */ UL { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 1.5em; LINE-HEIGHT: 1.4em; PADDING-TOP: 0px} /* Rule 24 of framework/typo.css */ UL LI { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 0.25em 30px; PADDING-TOP: 0px} /* Rule 4 of framework/typo.css */ A { COLOR: blue; BACKGROUND-COLOR: white; TEXT-DECORATION: none} /* Rule 5 of framework/typo.css */ A:link { COLOR: blue; BACKGROUND-COLOR: white; TEXT-DECORATION: none} /* Rule 8 of /css/info.css */ A { TEXT-DECORATION: none} /* Rule 11 of framework/typo.css */ H3 { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 1.3em; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 0.5em; COLOR: black; LINE-HEIGHT: 1.3em; PADDING-TOP: 0px} /* Rule 2 of /css/homepage.css */ DIV.box H3 { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-WEIGHT: normal; FONT-SIZE: 12px; BACKGROUND-IMAGE: url(/images/bg_box_title.png); PADDING-BOTTOM: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #a8bacd 1px solid; TEXT-ALIGN: center} </STYLE></HEAD><BODY><DIV id="page"><DIV class="clearfix" id="content"><DIV id="main"><DIV class="clearfix"><DIV style="FLOAT: left"> <DIV class="box" id="webmaster"><H3>GD.cn黑板报</H3><UL><LI><A href="http://localhost/" target="_blank">123456789</A> </LI><LI><A href="http://localhost/" target="_blank">3456789</A> </LI><LI><A href="http://localhost/" target="_blank">56789</A> </LI><LI><A href="http://localhost/member.php" target="_blank">7890</A> </LI></UL></DIV> </DIV></DIV></DIV></DIV></DIV></BODY></HTML>

一品梅 2008-03-09
  • 打赏
  • 举报
回复
css帖出来看看.
myvicy 2008-03-09
  • 打赏
  • 举报
回复
你的a样式.

61,129

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧