6

iPhone と HTC では適切に表示されるように設計した Wordpress Web サイト (Genesis フレームワークを使用) は、Samsung Galaxy 電話では正しく表示されません。(Samsung Galaxy S2 と Samsung Ace でテスト済み) 現在、FitVids プラグインを使用して、ビデオの埋め込みをレスポンシブにしています。

奇妙なことに、Samsung の携帯電話で表示されたビデオが埋め込まれていないページは適切に表示されますが、ビデオが埋め込まれたページでは、表示されるページ レイアウトはタブレット画面用であり、電話画面用ではありません。

他のさまざまなプラグインを試しましたが、どれもこの問題を解決していないようです。

誰かがこれについてアドバイスを提供できれば素晴らしいでしょう。

マイサイトはこちら

CSSスタイルシートはこちら

4

3 に答える 3

3

私が見つけたように、サムスンの画面は480 * 800pxです

以下のCSSで試してみてください。

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : landscape) {

}

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : portrait) {

}

ありがとう

于 2013-12-24T12:16:34.350 に答える
1

モバイル デバイスとデスクトップではピクセル サイズが異なる場合があるため、@media ルールを使用することはお勧めしません。

たとえば、次の代わりに:

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : landscape) {

}

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : portrait) {

}

margin-left が 5%、margin-right が 5% のコンテナーを追加します。

<body>
<div class="container">
# Your body goes here
</div>
</body>

これは、標準の @media ルールよりもはるかにユーザーフレンドリーで、レスポンシブ デザインへの維持されたアプローチであることがわかりました。

于 2013-12-30T01:22:58.977 に答える