2

こんにちは私はCSSのリセットから始める必要があることを理解していますが、デフォルトでChromeでウェブサイトを開発し、終了したらクロスブラウザ互換にすることを試み始めました。一般的なCSSリセットのいずれかを追加すると、余白がなくなり、テキストが小さくなり、背景のあるインラインSpanタグが互いに重なり合うことさえあり、すべてが台無しになります。

ですから、私が探しているのは、Chromeに設定されたCSSリセットです。これにより、他のすべてのブラウザがChromeのページと同じように表示されます。このようなものやそれを行う方法はありますか？

4

7 に答える 7

1

私自身の質問に対する解決策を一度見つけました。http://necolas.github.com/normalize.css/からnormalize.cssを試したところ、便利なモダンなスタイルが維持され、他のブラウザー（IEなど）での不満が修正されました。「IE9ドキュメント標準」を使用すると、ChromeとIEの両方でほぼ同じように見えます。

于 2012-10-17T14:56:52.720 に答える
1

この投稿によると：

HTML要素のブラウザのデフォルトCSS

http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.cssは、Chromeで使用されるCSSです。私はまだテストしていませんので、試してみて、動作するかどうかを確認してください。

于 2012-10-17T14:40:55.533 に答える
0

特別なブラウザのcssリセットはありません。そしてそれはまさにそれです、あなたはすべてのブラウザで同じ開始位置を持つようにcssをリセットしたいと思います。

あなたが直面している問題は、リセットをすぐに実装していないということです。今すぐリセットを統合し、次のプロジェクトのために、リセットから始めてそれに基づいてcssを構築することを学ぶために、他に選択肢はありません。

于 2012-10-17T14:39:40.627 に答える
0

私はいつもEricMeyersのcssリセットスニペットを使用しています。私は実際にhtml5ボイラープレートに含まれているものよりもそれが好きです。

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
于 2012-10-17T14:59:12.653 に答える
0

最近、Firefox27は新しいCSS3プロパティとデフォルトのキーワードを追加しました。

これで、Firefox 27以降で、次のコマンドでページ全体をリセットできます。

* { all: unset !important; }

それはハンマーアプローチです。あなたもはるかに洗練されることができます。

blockquote, option { margin:unset; }
a { text-decoration: initial; }

等

于 2014-02-19T20:39:21.520 に答える
0

これを行うと、Chromeユーザーには適していますが、Firefox、Edge、Opera、Safari、およびInternetExplorerのユーザーには適していません。

Chromeのhtml.cssファイルには、他のブラウザでは機能しないベンダープレフィックスがいくつか含まれています。

たぶん、それらは他のブラウザでも利用できません。例：-webkit-fill-available、そのための値はなく、Firefox以外のブラウザで使用可能なプレフィックスもあります。

このhtml.cssファイルは、プレフィックスに基づいています。ユニバーサルプロパティがブラウザで機能する場合でも、プレフィックスを使用しようとします。

Chromeユーザーにとってはネイティブなエクスペリエンスになる可能性がありますが、その一方で、残りの30％のユーザーにとっては妥協する必要があります。

さらに、それはあなたに負担を追加します。ユーザーの70％以上がクロムベースの（はい、すべてのブラウザーでhtml.cssファイルにいくつかの調整が加えられています）ブラウザーを使用しているためです。ブラウザの80％で単に役に立たない読み込み。

ファイルが十分に短いとは思いません。5kb未満に圧縮されます。

CSSノーマライザーの使用をお勧めします。normalize.cssに基づくものですが、維持されており、より優れています。

いくつかの完璧なCSSノーマライザーのリスト

于 2021-05-01T11:47:16.133 に答える
-1

http://html5boilerplate.com/をご覧になることをお勧めします。これには、ほとんどの最新のブラウザー用の構造とCSSがあります。

乾杯

イアン

于 2012-10-17T14:57:06.927 に答える