1

私はこれに慣れていないので、用語が正しくない場合は申し訳ありません。ベース (デスクトップ サイズと、メディア クエリと互換性のない古いブラウザーを考慮したもの)、モバイル ポートレート、モバイル ランドスケープ、タブレットの 4 つのスタイル シートを持つ Web サイトを構築しています。最後の 3 つはメディア クエリで読み込まれます。

Base に表示される特定の div コンテナがありますが、小さいデバイスのスタイルシートで「display:none」に設定されており、これはうまく機能します。

しかし、小さいデバイスで表示したい Base で「display:none」に設定されているものもありますが、小さいデバイスのスタイルシートでは Base スタイルシートの「display:none」が css よりも優先されます。

何か考えや提案はありますか？

4

2 に答える 2

0

したがって、htmlで次のようにcssを参照していると思います。

<link rel="stylesheet" type="text/css" href="base.css">
<link rel="stylesheet" type="text/css" href="other.css">
<link rel="stylesheet" type="text/css" href="another.css">

ベースには次のものがあります：

#element {
 display: none;
}

そしてあなたが持っているanother.css

#element {  display block; }

それらがそのように参照されている場合、another.css にある css は base にあるものを上書きします。

あなたが持っているかもしれません

body #element {
 display: none;
}

base.css で

そして持つ

#element {
 display: block
}

セレクターがbase.cssでより支配的であるため、another.cssでは機能しません。

他のすべてが失敗した場合、ハッキーな方法は、次のように !important を css ルールの最後に追加することです。

#element {
 display: block !important;
}

私は !important を使用するのは好きではありませんが、css セレクターを正しく取得できない場合の単なるアイデアです。

これはすべて、css と html を見ない推測作業です

于 2013-04-22T22:21:04.827 に答える
0

モバイル スタイルシートに display:block を貼り付けるか、display:block ! それでも拒否する場合は重要です。

于 2013-04-22T22:21:24.267 に答える