1

私のウェブサイトでは、人々はボードに画像を投稿してドラッグすることができます。

現在、私は以下を使用しています。

width:60%;

height 40%;

彼らは彼らの仕事を救うことができます。

位置は余白付きで保存されるため、画像top:50px;left:150px;

つまり、divの左の境界線の右側に50ピクセル、divの上部から50ピクセル下になります。

彼らが彼らの仕事をロードするならば、それはまったく同じに見えなければなりません。

したがって、画像が右下隅にある場合は、ファイルをロードするときに右下隅にある必要があります。

私の問題は、ユーザーが別の解像度でロードした場合、マージンが必要になり、次の画面で画面の解像度が大きい場合、1200の50%が原因でより多くのスペースがあるため、画像が右下隅に表示されないことです。 1900年の50%未満。

したがってwidth、とheightをピクセル単位で使用する必要がありますが、1200ピクセルに600ピクセルを設定すると見栄えは良くなりますが、1900ピクセルの600ピクセルは見栄えが悪くなります。

pxを使用する方法はありますが、すべてのページで見栄えを良くしますか?

基本的に私はpxを使用したいのですが、同じように見える必要があります(%を使用する場合のように)。マージンは同じになり、ページは同じように見えます。大きな解像度では大きなオープンスペースはありません。

例

この例では、1366年にボードを作成し、1024年に再度開いた場合、画像は左から余白を取り、元のボードから外れています。

ただし、ボード(黄色の背景)は画面の同じ%です。

だから私は画面の同じ%であるが、すべての解像度で同じ画像をロードするボードが欲しいので、1025画面の右下隅は1366画面の右下隅でなければなりません。

私がpxを使用する場合、サイトだけがすべての解像度で異なって見えます、そしてそれは私が防ぎたいものです。

4

1 に答える 1

-1

あなたがしなければならないように聞こえるのは、CSS でのアダプティブ テーマまたはレスポンシブ デザインです。

@media screen and (max-width: 1024px){
  img.bg {
    left: 50%;
    margin-left: -512px; }
}

最大幅 1024px の画面の場合は、img 要素を設定します。考慮したい画面サイズごとにこれらのいくつかを作成すると、画面サイズに関係なく、ユーザーに表示されるものを完全にきめ細かく制御できるはずです。

于 2013-03-22T09:01:07.217 に答える