ページに 1 つの背景と 1 つの中央の画像があります。その HTML + CSS。デスクトップブラウザでは問題なく動作します。しかし、Android デバイスから開くと、2 つの問題があります。
1- 背景画像がページに収まらない。
2- 中央の画像が拡大されたように見えます。ポートレート モードでは問題ないように見えますが、デバイスを横向きにすると画面に収まりません。画面解像度は 1280x720、画像サイズは 954x604 です。合うはずなのに合わない。単に大きく見え、画像の上部が見えません。
誰でも助けることができますか?
HTMLは次のとおりです。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Celline - Selin Sarpkan</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="resource/styles.css">
</head>
<body>
<div class="dispencere">
</div>
</body>
</html>
CSSは次のとおりです。
*{ margin:0; padding:0; }
body{
font-size:9px;
color:#666;
font-family:Arial, Helvetica, sans-serif;
overflow: hidden;
background-image:url('../images/paper.jpg');
background-repeat: no-repeat;
background-size:cover;}
.dispencere{
background-image:url('../images/main.png');
width:954px;
height:604px;
position:absolute;
left:50%;
top:50%;
margin:-295px 0 0 -465px;
text-align:center;}