モバイル端末でPCサイトのWebページを開くと、ページが乱れて表示されたり、背景画像が不完全に表示されたりすることがあります。モバイル端末ページと同じくらい適応性があることは言うまでもありませんが、少なくともそれは可能です。ページは正常に、きちんと整理されて見えます。
通常、PC サイトのタグなど、いくつかのメイト タグをページの head タグに追加します。
<meta name="applicable-device" content="pc"> は、アプリケーション デバイスが PC であることを示します
モバイル版を見てみましょう:
<meta name="applicable-device" content="mobile"> は、アプリケーション デバイスがモバイルであることを示します
それで、
携帯電話でPCサイトのページを開きたい場合は、次のように書きます。
<meta name="適用デバイス" content="pc,mobile">
この項目を追加すると、携帯電話でもPCサイトの完全なページを開くことができます。
--- 背景画像が完全に表示されないので、background: url(../img/bj1.png)no-repeat top center; のように書いたのかもしれません。
解決策: これも背景画像ですが、別の方法で記述されています。
- 背景画像: url(../img/bj1.png);
- 背景リピート: リピートなし;
- 背景位置: 中央;
このようにして、完全に表示できます。
--- バナー画像が完全に表示されない現象もあります。
解決策: img タグはインライン要素であるため、img をアカウンティング要素として設定し、img の幅を 100% にする必要があります。つまり、display:block;width:100%;