0

ウェブサイトに背景画像があります。メディアクエリを使用して、ブラウザウィンドウで背景画像のサイズを調整したい。メディアクエリの概念は初めてですが、その方法を教えてください。

ありがとう :)

私のCSSファイル:

.homepage{background-image:url(../images/work.jpg); background-repeat:no-repeat;}

私のHTMLファイルで

<body class="homepage">

</body>
4

1 に答える 1

1

たとえば、特定の画面解像度については、スタイルシートでメディアクエリを使用する必要があります

@media all and (max-width: 1200px) and (min-width: 520px) {
  body {
    /* Now whatever styles you use here will be applicable for your specified screen widths */
  }
}

したがって、問題が発生した場合は、画面の解像度に応じて体の背景を自動調整する必要があると思います。メディアクエリを使用せずにこれを試すことができます。

html { 
    background: url('/* Path to image file */') no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
于 2012-11-03T07:13:34.340 に答える