0

私は画像の多い単一ページのサイトに取り組んでおり、安全な高さ/幅の比率を把握しようとしています。これにより、幅が 100% に設定されている場合にスライドショー画像がどのくらいの高さになるかを大まかに把握できます。フォールドの下の「次へ」ボタンを押すことなく、すべてのページ要素。これは、ブラウザ インターフェイス、タスクバーなどを考慮に入れています。

これが私が言いたいことです：画像リンク

これらのレイアウトを処理するための 960 グリッドのような提案/研究/適用された準標準があるかどうか疑問に思っていますか?

明確にするために:シングルページサイトの例

私のブラウザー/画面 (解像度 1920x1080 の画面にメニューとアドレス バーがある FF19) では、[その他] ボタンがスクロールしなければ見えない位置にあるため、下にスクロールして表示する必要があります。これは私が避けようとしているものです。もちろん、スライドショーの画像を非常に薄くすることもできますが、ほとんどの場合、下に多くの余白が残るため、有効なバランスがあれば見つけようとしています。

乾杯！

4

1 に答える 1

0

ページの幅は 1024 ピクセルを超えないようにしてください。どのサイトを見ても、高さ 1024* を超えるページは作成されていないことがわかります。Web サイトを下方向にスクロール可能にしたくない場合は、1024*768 未満に固定してください。自分で試してみる必要があります。実際、私は幅として 900 から 1000 ピクセルの間のものを使用することを好みます。

サンプル CSS コード:

*{
    margin:0;
    padding:0;
    backgroound:#fff;

}
body { 

    font: .8em Arial, Tahoma, Verdana; 
    background: #fff url(../images/img.gif) repeat-x; color: #777; 
    width: 970px;
    margin: 0 auto;

}

編集: 幅を 100% に設定した場合の質問への回答に関しては、画像の幅はコンテナー div から継承され、高さは画像の実際の高さに依存します。高さがコンテナー div の幅よりも小さい画像の場合、高さは画像の幅よりも小さくなりますが、高さがコンテナー div の幅よりも大きい画像の場合、画像の高さは画像の幅よりも大きくなります。アスペクト比は次のようになります。でも保存されます。画像のサイズを変更した後、すべての画像の縦横比を維持したいと思うでしょう。画像がコンテナーの div の外に出て [その他] ボタンを押さないように、画像に max-width と max-height css プロパティを提供する必要があります。

アスペクト比を維持したくない場合は、画像の幅と高さを設定してください。

または、ページの左側にある Facebook や Google などのリンクのように、[もっと見る] ボタンをフロートできるようにしてみませんか?

于 2013-05-06T10:25:39.003 に答える