Question

我有3个背景的div。 IOS接口在iPhone和iPAD的所有格式之间添加白线。最初我认为这是表格的一个问题，但它也适用于div。

#cbtop {
    height:10px;
    background:url(http://www.golfbrowser.com/images/structure/cbmain.png) center top repeat-y;
}
#cbbottom {
    height:10px;
    background:url(http://www.golfbrowser.com/images/structure/cbmain.png) center bottom repeat-y;
}
#content {
    min-height:10px;
    background:url(http://www.golfbrowser.com/images/structure/cbmains.png) center top repeat-y;
}

仅在iOS上看到 - http://www.golfbrowser.com/courses/wentworth-east/

有什么想法吗？

非凡

Answer 1

白线实际上是两个div重叠。这是iOS游戏中的精确问题，几乎是不可避免的（imho）。放大时问题最突出，因为这是缺乏精确度的时候。

你 MAY 能够通过在底部div上使用半像素上边距来“欺骗”浏览器正常工作......但是，我无法测试这个。 / p>

在这种情况下，我会使用css border radius来实现相同的效果......虽然它无法在所有浏览器中正确显示，但您仍然可以找到一个可接受的解决方案

#cb
{
    background: rgb(255,255,255); // fallback for browsers without alpha support
    background: rgba(255,255,255, 0.5);

    border-radius: 30px;
}

还有边界半径属性的webkit和mozilla版本......这将有助于跨平台兼容性。

在此处详细了解背景Alpha透明度：http://robertnyman.com/2010/01/11/css-background-transparency-without-affecting-child-elements-through-rgba-and-filters/

见JS小提琴：http://jsfiddle.net/xixionia/4SYP4/

CSS背景线出现在iOS上

1 个答案: