さまざまなブラウザの CSS 互換性の問題を見つけるのに役立ちます。URL、コード、オンラインなどを添付します。_html/css_WEB-ITnose

URL、コード、オンラインなど、さまざまなブラウザーでの CSS の互換性の問題を見つけるのを手伝ってください...

会社用の Web サイトを構築しましたが、互換性の問題が発生しました。助けてください。

ナビゲーションの問題: IE8 では、通常モードと互換モードで問題はありません。 360 スピード モードまたは IE8 以下のバージョンで表示されるようになりました。
1. ナビゲーション バーの位置がずれており、マーキーが単独で表示されません。マウスをホームページに移動すると、マーキーが中央から表示されます。
2. プレートの境界線が太くなります。

オンラインで待っています! ！ ！私を助けてください！ ！ ！

http://szw.qj.gov.cn

ナビゲーション バーの CSS コードは次のとおりです:

*{margin:0px;}

#nav {
height:50px; :relative; フォントファミリー:arial、verdana、sans-serif; フォントサイズ:11px;z-index:0;
#nav .select {
margin:0;スタイル:なし ; ホワイトスペース:nowrap;
} #nav li {
浮動小数点: 左; 背景:url(blank_over_p.gif);

# nav .select a {
表示: ブロック; 高さ: 48px; 背景: url(blank_p.gif); 行の高さ: 25px; -space: nowrap; color:#fff;text-align:center;
}
#nav .select li:active {background:url(blank_p.gif) 右上;
#nav .select a b {
表示:ブロック; パディング: 0 23px 10px 10px; 背景: url(blank_p.gif) 右上; テキスト整列: 中央
}
#nav .select li:hover a {
背景: url(blank_over_p.gif); 0 0 0 10px; カーソル:ポインター; カラー:#eee;テキスト整列:センター;
#nav .select li:hover {
表示:ブロック:0 23px 9px 10px;背景:url(blank_over_p.gif) 右上; カーソル:ポインタ;

#nav .sub {
表示:なし;マージン:0;リストスタイル:なし; ;
}
#nav .sub li {background:transparent;text-align:center;}
#nav .select li:hover .sub {
表示:ブロック; 絶対幅:1020px; : 28px; 左: 0;
#nav .select li:hover .sub li {
表示: ブロック; 高さ: 20 ピクセル; URL (transparent.gif); パディング:0 18px; ホワイトスペース:nowrap; ボーダー:#888 #777 #666; フォントサイズ: 13px; text-align:center;
#nav .select li:hover .sub li a:hover {
color:#000; 背景色: #fff #333 #000 #fff; line -height:15px; text-align:center;}



ホーム ページの CSS コードは次のとおりです。 -FAMILY: "Arial "、"Helvetica"、"sans-serif"; テキスト装飾: なし
} .t2 {
FONT-SIZE: 12px; LINE-HEIGHT: 15px; "Arial"、" Helvetica"、"sans-serif"; テキスト装飾: なし
} .kj1 {
ボーダー右: #6c4824 1px ソリッド; ボーダートップスタイル:なし; BORDER-BOTTOM -STYLE: none
} .t3 {
FONT-SIZE: 12px; LINE-HEIGHT: 15px;
} .bk { BORDER-BOTTOM: #663333 1px 点線
}
.bk1 {
BORDER-BOTTOM: #cccccc 1px 点線
}
.t4 {
FONT-SIZE: 12px; 3 33; -高さ: 15px; フォントファミリー: "Arial"、"Helvetica"、"sans-serif"
}



ボディ { カラー: #666666; FONT-FAMILY: 「?? ã?」; フォント サイズ: 10pt; マージン: 0px; スクロールバーのハイライト色:
#F5F9FF; スクロールバー-シャドウ-カラー: #828282; スクロールバー-3Dライト-カラー: #828282; スクロールバーの矢印の色:
#797979; スクロールバー-トラック-カラー: #ECECEC; スクロールバー-ダークシャドウ-カラー: #ffffff }

A:link { COLOR: #FFFFFF; フォントサイズ: 9pt; テキスト装飾: なし }
A: 訪問済み { COLOR: #FFFFFF; フォントサイズ: 9pt; テキスト装飾: なし }
A: hover { COLOR: #0099FF; フォントサイズ: 9pt; テキスト装飾: 下線 }
A: アクティブ { カラー: #336699; フォントサイズ: 9pt; テキスト装飾: なし }

A.white:link { COLOR: #ffffff; フォントサイズ: 9pt; テキスト装飾: なし }
A.white:visited { COLOR: #ffffff; フォントサイズ: 9pt; テキスト装飾: なし }
A.white:hover { COLOR: #eeeeee; フォントサイズ: 9pt; テキスト装飾: 下線 }
A.white:active { COLOR: #FFFFFF; フォントサイズ: 9pt; テキスト装飾: なし }

A.blue:link { COLOR: #ff0000; フォントサイズ: 9pt; テキスト装飾: なし }
A.blue:visited { COLOR: #ff0000; フォントサイズ: 9pt; テキスト装飾: なし }
A.blue:hover { COLOR: #ff9900; フォントサイズ: 9pt; テキスト装飾: 下線 }
A.blue:active { COLOR: #ffffff; フォントサイズ: 9pt; テキスト装飾: なし }

テーブル { カラー: #ffffff; FONT-FAMILY: 「?? ã?」; フォントサイズ: 9pt; LINE-Height:15px }
TABLE.Mtable3 TD { BORDER-BOTTOM: #425d8c 1px solid; ボーダー左: #ffffff 0px 実線; 右枠: #ffffff 0px 実線; BORDER-TOP: #91b0d7 1px solid }
TABLE.Mtable2 TD { BORDER-BOTTOM: #bedafe 1px solid; ボーダー左: #ffffff 0px 実線; 右枠: #ffffff 0px 実線; BORDER-TOP: #ffffff 0px solid }
TABLE.Mtable1 TD { BORDER-BOTTOM: #bedafe 0px solid; ボーダー左: #ffffff 0px 実線; 右枠: #ffffff 0px 実線; BORDER-TOP: #ffffff 0px solid }

.list { BACKGROUND-COLOR: #990000; 色: #ffffff; FONT-FAMILY: 「?? ã?」; FONT-SIZE: 12px }

.textboxLINE_1 { BACKGROUND-COLOR: #D6F7FF; 
境界線の下: #b4b4b4 1px double; 
ボーダー左: #b4b4b4 0px ダブル; 
ボーダー右: #b4b4b4 0px ダブル; 
BORDER-TOP: #b4b4b4 0px double }

.textbox { BACKGROUND-COLOR: #ffffff; 
境界線の下: #b4b4b4 1px double; 
ボーダー左: #b4b4b4 1px ダブル; 
ボーダー右: #b4b4b4 1px ダブル; 
BORDER-TOP: #b4b4b4 1px double }

.Bbutton { BACKGROUND-COLOR: #D6F7FF; 
境界線の下: #ff0000 1px 無地; 
ボーダー左: #ff0000 1px 無地; 
ボーダー右: #ff0000 1px ダブル; 
ボーダートップ: #ff0000 1px ソリッド; フォントサイズ: 9pt; 高さ: 13pt;color:#990000}


.style2 {font-family: "????"; font-size:10pt;}

回复讨论(解决方案)

政府网站啊 , 告诉你个不幸の消息,谷歌,火狐打开页面都左浮動了。 根本的に没居中。最新バージョンのプレイヤーを招待します。IE と互換性があります。

firefox の下の二層の菜食はコンテンツの上にあり、ネット全体は左端にあります。也行，用js动态的追加ダウンロード

好像都是用table 布局的，先在 css 里，让页面居中吧

 table{margin: 0  auto;}

ページは中央に配置されましたが、互換性の問題はまだたくさんあります。div+css を独学で勉強し始めたので、いつかウェブサイト全体を変更する予定です。

私は何年もウェブサイトを作成していませんでした。このホームページのテンプレートを作成したのは 2009 年でした。当時はブラウザがそれほど多くなかったので、互換性の問題には注意せずに IE でのみ作成しました。今、それを削除して 360 で開いたのですが、開いても同じように見えます。最も迷惑なのは、Firefox を開くと完全にイライラすることです。ウェブサイトの初心者には、ウェブサイトを作成する前にまず div+css を学ぶように注意してください。