A JavaScript Fancier

伟大的javascript技术研究中...

  IT博客 :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理 ::
  304 随笔 :: 0 文章 :: 479 评论 :: 0 Trackbacks


在无忧上看到一个问这个问题,偶也比较感兴趣,楼主代码是这样写的:
<div style = "width : 240px; height : 315px; line-height:100%;">
<img src = "1.gif" border = "0" height = "56" width = "240" />
 <img src = "1.gif" border = "0" height = "56" width = "240" />
<img src = "1.gif" border = "0" height = "56" width = "240" />
<img src = "1.gif" border = "0" height = "56" width = "240" />
<img src = "1.gif" border = "0" height = "56" width = "240" />
</div>
这样看到的效果就是每个图片之间有小段空白。
有朋友贴出解决代码如下:
<div style = "width : 240px; height : 315px; line-height:100%;">
<img src = "1.gif" border = "0" height = "56" width = "240" /><img src = "1.gif" border = "0" height = "56" width = "240" /><img src = "1.gif" border = "0" height = "56" width = "240" /><img src = "1.gif" border = "0" height = "56" width = "240" /><img src = "1.gif" border = "0" height = "56" width = "240" /></div>
即删除每个<img>标记之间的换行符,将所有标记连接在一起,这样问题解决了,但降低了代码的可读性,显然不是一种完美的解决办法。最后hbjswj大哥给出了一种比较好的办法.全部代码如下:
<style>
img 
{float:left;}   /*注意这个地方*/
</style>
<div style = "width : 240px; height : 315px; line-height:100%;">
<img src = "1.gif" border = "0" height = "56" width = "240" />
<img src = "1.gif" border = "0" height = "56" width = "240" />
<img src = "1.gif" border = "0" height = "56" width = "240" />
<img src = "1.gif" border = "0" height = "56" width = "240" />
<img src = "1.gif" border = "0" height = "56" width = "240" />
</div>
为每个img增加了float:left,这就比较完美的解决了这个问题

posted on 2006-06-16 10:53 Yemoo'S JS Blog 阅读(451) 评论(0)  编辑 收藏 引用 所属分类: HTML/XHTML/CSS
只有注册用户登录后才能发表评论。