1

完全な正方形ではない画像を使用し、画像の左上と右下に使用するというコンセプトに取り組んでいますが、画像スライダーから 25px 離れた位置に配置したいと考えています。

これをモックアップのように配置する適切な方法は何ですか?

これが最善の方法position:relative; and top/left: -XXpx;だと思いますが、間違っている可能性があります

etcを使ったポジショニングmargin-left: -XXpx;これはまったく正しいとは思わない

I を使用した位置vertical-alignは、これを機能させることに失敗しました

これがそのフィドルです - Stripped Down

サイトがどのように見えるかのイメージ -- Photoshop でのモックアップ

4

1 に答える 1

1

はい、最初のアプローチが最適です: http://jsfiddle.net/zFa99/8/

position: relativeメイン イメージと 2 つのコーナー イメージを保持するコンテナーを配置し、コーナー イメージを絶対に配置します。

#slider { position: relative; }
.tl-corner, .br-corner { position: absolute; }
.tl-corner { bottom: 0; right: 0; } /* this line is not ncessary as top:0 and left:0 are default */
.br-corner { bottom: 0; right: 0; }

コーナー画像を浮かせる必要はありません。

于 2012-10-04T20:51:55.417 に答える