2

htmlとcssについて質問があります（PURE htmlとcss-JavaScriptやJQueryはありません）

ページに2つの列があります（最初の-幅：35％（ページ）、2番目の-幅：65％（ページ））。最初の列に画像があります-300pxx300px。そして、ページのサイズを変更しています。

  • 最初の列の幅が300pxを超える場合、画像は300pxx300pxである必要があります
  • 最初の列が100pxより広く300pxより狭い場合-画像は100pxx100pxである必要があります-最初の列が100pxより狭い場合-画像は消えます。

JavaScriptを使用するのは非常に簡単ですが、HTML+CSSでのみ実行する必要があります。

誰かがそれを行う方法を知っていますか？

ありがとう！

4

1 に答える 1

0

CSS3 メディア クエリを使用してこれを行うことができますが、もちろん、これはすべてのブラウザーでサポートされているわけではありません (これは単に与えられたものです)。

例: 表示領域が 600px より小さい場合、次の CSS が適用されます。

@media screen and (max-width: 600px) {
  .class {
    background: #ccc;
  }
}

参照:
http://webdesignerwall.com/tutorials/css3-media-queries

于 2012-04-26T12:46:17.700 に答える