2

私は自分のプロジェクトのWebページをデザインしました。これは、Internet Explorerを調べると、FirefoxとChromeで見栄えがよく、画像の位置とテーブルの位置がすべて正しく配置されていませんでした。reset.cssファイル（ericの最新バージョン）をインポートしようとしましたが、これにより、すべてのページの不適切な配置テーブルが表示されます。

ユーザーエージェントに基づいてcssをロードするのは良いですか？

   if ie:
      <link ....</link>
   else:
      <link>...</link>

それはどのように行われるべきですか？

また、すべての解像度の画面で採用できるレイアウトを調整するにはどうすればよいですか？

私のページは、12〜15インチの解像度の画面で表示すると問題なく表示されます。一部の幅の広い画面では、見栄えがよくありません。

それはどのように扱われるべきですか？

前もって感謝します。

4

3 に答える 3

4 
<!--[if IE 8]>
        <link rel="stylesheet" href="css/ie8.css"/>

<![endif]-->

ieのスタイルシート

選択できる解像度に関係なく、メディアクエリを使用してレイアウトを調整できます

何かのようなもの

@media all and (min-width:500px) { … }
@media (min-width:500px) { … }

メディアクエリ

于 2012-08-06T04:44:16.547 に答える
2

conditional commentIEブラウザに使用できます。このように書いてください：

<!--[if IE 8]>
  <link rel="stylesheet" href="ie8.css"/>
Special instructions for IE 8 here
<![endif]-->

詳細については、こちらをお読みくださいhttp://www.quirksmode.org/css/condcom.html

于 2012-08-06T04:42:43.100 に答える
0

CSS 条件付きコメントを使用すると、ブラウザをターゲットにすることができます。

ページに次の行を追加することにより、<HTML>ブラウザ固有のスタイル シートまたは Java スクリプト ファイルを定義できます。

IE ブラウザの場合

<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="css/ie.css" />
<![endif]-->

IE 以外のブラウザの場合

<!--[if !IE]><!-->
    <link rel="stylesheet" type="text/css" href="css/non-ie.css" />
<!--<![endif]-->

メディア クエリを使用すると、必要な画面解像度をターゲットにして、レスポンシブ Web サイトのレイアウトを作成できます。

@media screen and (max-width: 699px) and (min-width: 320px) {
   div { background: blue; width: 100px; height: 100px; }
}


@media screen and (max-width: 1024px) and (min-width: 700px) {
   div { background: green; width: 300px; height: 100px;  }
}


@media screen and (max-width: 1280px) and (min-width: 1025px) {
   div { background: red; width: 600px; height: 100px;  }
}​

フィドルの例

メディアクエリの使用方法について詳しく学ぶことができます

于 2012-08-06T05:33:28.180 に答える