4

私はmodernizrが私を好きではないと思います.誰かが私が間違っていることを教えてもらえますか. Firefox などで modernizr を動作させることができないようです...ヘッダー、フッター、ナビゲーションなどの要素のみを使用しています...

これは私のコードです:

<!DOCTYPE html>
<!--[if lt IE 7 ]> <html class="ie ie6 lte9 lte8 lte7 no-js"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie ie7 lte9 lte8 lte7 no-js"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie ie8 lte9 lte8 no-js"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie ie9 lte9 no-js"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class="notie no-js"> <!--<![endif]-->
  <head>
    <title></title>
    <meta name="description" content="" />
    <link href="css/main.css" rel="stylesheet" type="text/css" /> 

    <script src="modernizr-2.0.6.min.js"></script>

    <script type="text/javascript" src="http://use.typekit.com/kmy1sfb.js"></script>
    <script type="text/javascript">try{Typekit.load();}catch(e){}</script>

  </head>

正常に出力されるfirebugをチェックすると、想定されているすべての要素を取得できますが、どの要素も機能していません...

たとえば、firebug でヘッダーをクリックして CSS の高さを 5000px に編集しても移動せず、配置なども正しくありません。

4

2 に答える 2

12

新しいHTML5要素をブロックレベルの要素としてスタイル設定するのを忘れている可能性があります。デフォルトでは、ブラウザは不明な要素をインライン要素(display:inline)として扱います。これにより、ブラウザで多くのことを行うことが困難になります。

新しいブラウザは、新しいHTML5要素をゆっくりと安定したものとして扱います。つまり、たとえばdisplay:block、要素のようなデフォルトのスタイルをブラウザに与え始めます。headerただし、現在市場に出回っているほとんどのブラウザには、HTML5要素のデフォルトのスタイルがないため、それらを提供する必要があります。

これを行うためのCSSの簡単なサンプルビットを次に示します。

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

そのCSSをmain.cssに追加すると、スタイルの問題が修正されます。

于 2011-07-13T01:30:31.173 に答える
1

CDN を使用しようとしたときに同じ問題が発生しましたが、機能していませんでした (リンクが間違っていた可能性があります)。私が見つけたテストは置くことでした

.borderradius body {
  background: #c00;
}

main.css で、背景が赤くなるかどうかを確認します。modernizr であれば動作しています。

編集: HTML ドキュメントの先頭にスクリプトを挿入する必要があることもわかりました。ページの読み込み速度を向上させるために提案されているように、それを一番下に置くことは機能しません.

于 2011-07-12T13:30:47.117 に答える