0

モバイル固有のスタイルシートをいじっています。メディアクエリを使用して、「styles_mobile.css」というシートを使用して、モバイル訪問者に固有のスタイルを追加しています。

元のスタイルシートに加えて独立したスタイルシートを使用するのではなく、モバイル ユーザーの場合はモバイル スタイルシートのみを使用する方法があればいいのにと思います。

とにかく、私はコードなしでは方法を見つけることができないので (私はコードを書くことができず、軽いクライアント側のスキルしかありません)、モバイル レイアウトをいじる必要があります。

コンテンツが画面の幅にのみ収まるようにスタイルを設定できないモバイル スタイルシートで修正しようとしているプロパティ値がないようです。モバイル HTML を画面幅の 100% より長く表示するルールがどこかにあり、これは元のスタイルシートから取られた多くのものである可能性があります。

URL は、「styles_mobile.css」シートを使用する必要があるモバイル デバイスで表示できる場合は、ここにあります。問題が見えるように、すべての要素に実線のアウトラインを追加しました。

http://tinyurl.com/7ywoqpf

ページの上部には、メイン スタイルシートの width または min-width プロパティ値から画面を引き延ばす要素が明らかにあります。これらをどれだけ修正しようとしても、できません:-(

何か案は？

4

2 に答える 2

1

スタイルシートごとに最小幅を設定して、目的の幅より下の幅に干渉しないようにできるかどうかを確認してください。次のようになります。

<link rel="stylesheet" type="text/css" media="only screen and (max-width: 810px) and (min-width: 721px)" href="tabstyle.css">
于 2013-06-10T11:11:01.527 に答える
0

この方法を使用します

<link rel="stylesheet" media="all" href="css/common.css">
<!--Responsive style sheets -->
<link rel="stylesheet" media="all and (min-width: 768px) and (max-width: 1407px)" href="css/tab-only.css">
<link rel="stylesheet" media="all and (min-width: 0px) and (max-width: 767px)" href="css/phone-only.css">
于 2012-05-10T05:58:38.217 に答える