2

我想知道是否可以position: absolute;在 iOS6 的视口之外定位元素。

即使当我使用<meta name="viewport" content="width=640, maximum-scale=0.5, initial-scale=0.5, minimum-scale=0.5" />它时,如果一个元素被定位为类似right: 0; margin-right: -100px;(视口外 100 像素),它也会使视口具有更大的宽度。

iOS 试图在视口中包含这个元素,这不是我想要的。我想让它部分可见和部分隐藏。iOS 添加了水平滚动条并包含了应该隐藏的元素部分。

4

1 回答 1

1

是的,如果您使用包装器overflow: hidden

此示例显示了一个 100x100px 的红色矩形,它位于视口右侧 50px 的位置,但视口不包括它。

创建一个#limit与视口右侧对齐的容器。通过设置溢出防止内容放大视口。

<!DOCTYPE html>
<html>
    <head>
        <style type="text/css">
            #limit {
                position: absolute;
                top: 0px;
                right: 0px;
                width: 100px;
                height: 100px;
                overflow: hidden;
            }

            #offset {
                position: absolute;
                top: 0px;
                right: -50px;
                width: 100px;
                height: 100px;
                background: #f00;
            }
        </style>
    </head>
    <body>
        <div id="limit">
            <div id="offset">
                Hello
            </div>
        </div>
    </body>
</html>
于 2013-03-11T17:08:01.797 回答