Androidウェブビューの表示ポートの問題

Question

Android Appには、Webサイトにリンクするボタンがあります。ボタンをクリックすると、Android Web ViewでWebページが表示されます。

私はAndroidアプリ経由でウェブページにアクセスしました。私は大きなデスクトップ画面を見ているように、そのすべてを見たいと思っています。

私はモバイルChromeブラウザを介してウェブページを訪問した場合ので、私は、ビューポートの幅

<meta name="viewport" content="width=980"> 

を設定します。それは適切に働いています。 下の図のように

私はAndroidのWebビューでWebページにアクセスします。私は設定なぜビューポートの変更を知らない絵

以下のように、それは、モバイルデバイスの画面幅 にフィット。 さらに、Galaxy S7を使用しています。

ご了承ください。

Answer 1

コンテンツに特定の幅を指定しないでください。むしろ、対応するデバイスのピクセル密度に応じて幅を設定することができます。

#header { 
    background:url(medium-density-image.png); 
} 

@media screen and (-webkit-device-pixel-ratio: 1.5) { 
    /* CSS for high-density screens */ 
    #header { 
     background:url(high-density-image.png); 
    } 
} 

@media screen and (-webkit-device-pixel-ratio: 0.75) { 
    /* CSS for low-density screens */ 
    #header { 
     background:url(low-density-image.png); 
    } 
} 

：

あなたは1つのスタイルシートに異なるスタイルを指定し、各濃度のため

<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.5)" href="hdpi.css" /> 
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.0)" href="mdpi.css" /> 

を別のスタイルシートを作成したりすることができます