您现在的位置: 动易技术中心 >> 动易产品知识库 >> SiteFactory常见问题 >> 正文
css定义导致图片循环错位的问题

问题:在这里“快乐成长”栏目中的图片css应该怎么写?一开始写好了,但加文章的时候就乱了。

 

解决:看您网站的源代码:

<ul><li><div class="pe_u_thumb"><a href="/Item/1717.aspx"><img class="pic2" src="/UploadFiles/KLCZ/2008/4/200804191232104419.jpg"  width="75" height="85" alt="彭妍妍:喜欢舞蹈,艺苑小花" border="0" /></a></div><div class="pe_u_thumb_title"><a href="/Item/1717.aspx">彭妍妍:</a></div><div class="pe_u_thumb_title_2" /></li>

<li><div class="pe_u_thumb"><a href="/Item/1716.aspx"><img class="pic2" src="/UploadFiles/KLCZ/2008/4/200804191232104419.jpg"  width="75" height="85" alt="彭妍妍:喜欢舞蹈,艺苑小花" border="0" /></a></div><div class="pe_u_thumb_title"><a href="/Item/1716.aspx">彭妍妍:</a></div><div class="pe_u_thumb_title_2" /></li>

……

  您这里是利用li的宽度控制来实现图片左右排列循环的,但是,li在高度上有差异时,就会出现上述图片中错位的现象(如您现在的标题中的文字“彭妍妍:”与“11111111”的高度在浏览器中解析就会有差异)。

  因此,解决您的问题很简单,只要使浏览器让循环的li解析出相同的高度即可。您可以用下面的方法解决您的问题:

  1、可以定义控制标题的CSS“pe_u_thumb_title”有相同的高度。

  2、可以定义li有相同的高度。

  如:

.pe_u_thumb_title{
    height: auto !important;
    height: 24px;
    min-height: 24px;
}

文章录入:雅虎    责任编辑:雅虎 
  • 上一篇文章:

  • 下一篇文章:
  • 发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
    动易SiteFactory标签说明
    动易2006网站标签说明列表
    动易用户手册
    联系我们 | 关于动易 | 网站地图 | 相关证书 | 合作伙伴 | 招贤纳士 | 法律条款 | 隐私权声明
    安全上网网上报警
    动易网络科技有限公司版权所有 © 2003-  粤ICP备05004015号
    公安备案编号:4406063010734 本站基于 PowerEasy® SiteWeaver™ 制作