1
いいえ、要素が特定の幅に達したときに@mediaタグを使用して写真を置き換えようとしていますが、元々100％に設定されていましたが、私はそれが応答性の問題を引き起こす可能性があるので、私はそれを最大幅と最小幅に変更したと読んだが、ここではコードは変更されていない。@media with width：100％
注：私は幅を変更していない要素が問題
body,html {
margin: 0;
height: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 1920px) {
.container {
min-width: 768px;
max-width: 1920px;
height: 100%;
background-image: url('https://images.pexels.com/photos/214519/pexels-photo-214519.jpeg?w=1260&h=750&auto=compress&cs=tinysrgb');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
};
};
@media only screen and (min-width: 300px) and (max-width: 767px) {
.container {
min-width: 300px;
max-width: 767px;
height: 100%;
background-image: url('https://images.pexels.com/photos/159146/train-cargo-bow-river-banff-159146.jpeg?w=1260&h=750&auto=compress&cs=tinysrgb');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
};
};<!DOCTYPE html>
<html>
<head>
<link href="style.css" type="text/css" rel="stylesheet" />
<meta name="viewport" content="width=device-width" />
</head>
<body>
<div class="container"></div>
</body>
</html>
メディアシュは、画面サイズのため、いない要素のためのものであるMaxwells.c @ –
のサイズはい、それは本当だしかし目標は、誰かがiPhoneを使っていると言うために、彼らは「X」イメージを持つことになりますですデスクトップ上の誰かが「y」イメージを読み込むでしょう。私は画面サイズを検出してCSSを編集する方法としてメディアを使用しています。 – bignate132
'only screen'ではなく' screen'を設定しようとしています。そして、最小/最大幅を使用する必要はありません.100％を使用できます。 –