7

コンテンツ（画像）が大きすぎる場合は、その寸法を短くして下に置く必要があるように、max-height:270pxと を同時に設定するにはどうすればよいですか。height:auto270pxauto

試してみましoverflow-Yたが、スクロールバーは必要ありません。写真のミニバージョンです。どうやってやるの？

4

6 に答える 6

1

このように使う

height:auto;
max-height: 270;
Overflow:hidden;

max-height は、画像の高さがそれよりも高い場合、画像の高さをその px に制限します。高さの量が画像の高さよりも小さい場合、特定の高さを指定すると画像がスケーリングされます。オーバーフローを非表示にすると、スクロール バーが非表示になります。

于 2013-09-06T08:44:53.163 に答える
0

次のように使用します。

height: 0; /*rather than auto*/
max-height: 270px;
于 2013-09-06T08:39:27.333 に答える
0

これを行うだけです：

<img style="max-height:270px" src="500x500.png" alt="I am resized to 270x270"> 
<img style="max-height:270px" src="200x200.png" alt="I am not resized">

高さ/幅を設定しないことで、ブラウザは で設定した制限までネイティブ サイズで画像を表示できますmax-height。

h/w を省略することはベスト プラクティスではありませんが、ブラウザが表示する前に各画像サイズを計算する必要があるため、実行しようとしていることが簡単に実現され、ページの読み込みに数分の 1 秒長くかかるだけです。

例: jsFiddle

于 2013-09-06T09:16:04.987 に答える
0

image タグに width を適用しないでください。CSSをに設定しますmax-width:100%; max-height:100%;

また、これを読んでくださいhttp://unstoppablerobotninja.com/entry/fluid-images

于 2013-09-06T08:54:37.157 に答える
-1

私が理解している限り、1つはGoogle Chromeで動作し、もう1つは他のすべてのブラウザーでそれらを組み合わせる方法の2つのコードを持っています.(そうでない場合は、私のコードを少し編集してニーズを満たすことができます)

<?PHP if($browser == "Chrome"){ ?>
<!--HTML Code for Chrome browser-->
<?PHP }else { ?>
<!--Code for other browsers-->
<?PHP } ?>

これはクロスブラウザスクリプトに役立ちます

于 2013-09-06T10:42:42.323 に答える