实现淘宝详情页 图片排列问题

628 阅读1分钟


问题分析:img本来是行内元素,却可以用width 和height,

当父元素没有设置高度的时候,用子元素们的高度计算出的高度给父元素的时候就会出现3px空隙这类的问题。

页面中如果有多张图片,那么图片之间会有一些间距(亲测有用)

// 上下 排列解决方案
img  
{  
  outline-width:0px;  
  vertical-align:top;  
}

// 或者

img标签的父级上写:font-size:0;



网上查询到的方法 

  1. 给img 标签使用display:block(img是内联元素)  
  2. img 父级标签使用letter-spacing属性  style="letter-spacing:-800px"