0

私はすでにウェブサイトを作っています。これのモバイル版を作りたいです。基本的にメインサイトからモバイルサイトにテーブルをインポートしたいと思います。テーブルをカバーするメインサイトからCSSコードを取得し、モバイルサイトのCSSファイルに入力したいと思います(既にHTMLコードをモバイルサイトに配置しています)。問題は、そうすると、現在のCSSファイルが上書きされてデザインが変更され始めることです。

助けてください!!

4

1 に答える 1

0

メディア クエリを使用する必要があります。これは css3 関数です。html の先頭に、次を配置する必要があります。

<meta name="viewport" content="width=device-width" />

次に、CSS で次のようにします。

@media only screen and (max-width : 320px) {
/* Styles */
}

よく使われるメディアクエリの参考サイトです。 http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

基本的に、最適化するデバイスのサイズごとにこれを行う必要があります。また、これらが複数ある場合は、非常に大きな css ファイルになる可能性があります。これは、特に電話でのダウンロード速度を妨げる可能性があります. その場合は、別の小さな css ファイルを作成し、html で条件ステートメントを使用して、呼び出す css を指定します。その場合、html で次のようなものを使用する必要があります。

<link rel="stylesheet" type="text/css" media="only screen and (max-width: 480px), only screen and (max-device-width: 480px)" href="/assets/css/small-device.css" />
于 2012-07-18T02:39:00.100 に答える