1

私は div を使用して 3 つのセクションを設定しようとしています。1 つのメイン セクションが中央にあり、小さな列が左右にあります。私はこれを行うことができましたが、正しい列を固定位置にすることができません。このセクションに「position: fixed」を追加すると、「float: right」が無視され、セクションが左の列の上に配置されます。コードで div の左右中央を並べ替える必要があることに注意してください。そうしないと、右側の列が他のコンテンツの下の右側に配置されます。ありがとう。

    <div style = "height: 100%">

    <div style = "width: 15%; float:left; background-image: url(image.jpg);
    background-size: 100% 100%;height: 100%; background-repeat:no-
    repeat; background-position:left top; position: fixed" >
    <div style = "margin-left:20px; margin-right:20px; margin-top:40px; margin-
    bottom:40px">

    <p2>
    content
    </p2>
    </div>
    </div>

    <div style = "width: 15%; float:right; background-image: url(image.jpg);
    background-size: 100% 100%; min-height: 100%; background-repeat:no-
    repeat; **position: fixed;** background-position:right top">
    <div style = "margin-left:20px; margin-right:20px; margin-top:40px; margin-
    bottom:40px">

    <p2>
    content
    </p2>
    </div>
    </div>

    <div style = "width: 60%; margin-left:300px; margin-right:300px; top: 100px" >
    <h1>head  </h1>
    <p>content
    </p>

    </div>
    </div>
4

1 に答える 1

1

要素に固定位置を指定すると、画面上でその位置を強制できます。たとえば、div が左側に固定されている場合、「left: 100px」を追加して、100px 右に移動できます。つまり、要素を左から 100px 移動します (右に移動します)。この測定値は、この場合に有効な値 (75% など) に変更できます。

CSSも調べてください。マークアップにスタイルを正しく配置すると、面倒で繰り返しが多くなる可能性があります。ブラウザー ウィンドウでページを縮小することを意図しているかどうかはわかりませんが、ほとんどの Web ページでは、列の幅をパーセンテージではなくピクセルで指定しています。

于 2013-02-10T06:53:34.870 に答える