1

これは説明が少し難しいので、私の言いたいことを示すjsFiddleを次に示します。

<style>
    .clip {
        clip-path: url(#clippath);
        -o-clip-path: url(#clippath);
        -moz-clip-path: url(#clippath);
        -webkit-clip-path: url(#clippath);
    }
</style>

<div id="container">
    <svg>
        <defs>
            <clippath id="clippath">
                <rect x="0" y="0" width="50" height="320" />
            </clippath>
        </defs>
    </svg>

    <div id="d1">Bottom</div>
    <div id="d2" class="clip">Middle</div>
    <div id="d3">Top</div>
</div>

問題は、クリップパスを絶対配置要素に適用したいということですが、DOM でその後に表示される他のすべての絶対配置要素もクリップされることがわかりました。奇妙なことに、これは相対的に配置された要素には当てはまりません。

目的の要素だけがクリップされていることを確認するにはどうすればよいですか? 私のコードに問題はありません。これはバグですか？

4

1 に答える 1

0

これは、Internet Explorer (HTML 要素のクリップパスを完全にサポートしていない) を除いて、私がテストしたすべてのブラウザーで正しく動作するようになり、もはや問題ではありません。

于 2015-04-09T15:07:48.260 に答える