0

Html は次のとおりです。

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="wp-1-main.css">
    <title></title>
</head>
<body>
    <div class="wrapper">
        <div class="textArea"></div>
    </div>
    <div class="imageLine">
    </div>
</body>
</html>

CSSは

.wrapper{
    width: 100%;
    height: 400px;
    position: fixed;
    top: 50%;
    margin-top: -200px;
    border-top: solid 1px black;
    border-bottom: solid 1px black;
    background-color: pink;
}

.imageLine{
    width: 500px;
    height: 1500px;
    float: right;
    margin-right: 60px;
    background-color: grey;

}

私の目標は、 .imageLine がいくつかの .wrapper をカバーし、ラッパーが垂直方向に中央に配置され、常にビューポートに表示されるようにすることです。しかし、これらのコードは .wrapper が .imageLine をカバーしていることが判明しました。それを修正するアイデアはありますか？

4

1 に答える 1

1

z-indexを使用できます

より高い Z インデックスは、より低い Z インデックスの前に来ます。

于 2012-07-01T10:51:42.140 に答える