12

Zurb Foundation を Web プロジェクトに使用するのは初めてです。ただし、別のスタイルシートで独自のスタイルをオーバーライドするか、直接編集するかはわかりませんfoundation.css。

たとえば、これは彼らのナビゲーション css です (内部foundation.css):

.nav-bar {
    background: #4D4D4D;
    height: 40px;
    margin-left: 0;
    margin-top: 20px;
    padding: 0;
}

backgroundandを変更したい場合は、独自のスタイルシートmargin-topを直接編集.nav-barするfoundation.cssか作成して (style.css下に配置foundation.css)、次のようにオーバーライドします。

.nav-bar {
    background: #999;
    margin-top: 0;
}

これは良い習慣ですか？そうでない場合、それを行うための最良の方法は何でしょうか?

4

4 に答える 4

21

ベスト プラクティスは、説明したようにカスタム .css ファイルを使用してスタイル シートをオーバーライドすることです。このように、バグ修正などの更新がリリースされた場合は、foundation.css ファイルを置き換えるだけです。

foundation.css ファイルを直接編集してフレームワークを更新したい場合は、自分で手動で更新する必要があります。

于 2012-12-10T14:23:54.370 に答える
9

ベスト プラクティスは、Zurb Foundation Web サイトのドキュメントを読むことです。2 番目のベスト プラクティスは、ダウンロード内でcssとjsの 2 つのフォルダーを開くことです。このフォルダ内には、次のものがあります。

app.cssとapp.js

これらは Zurb が事前に作成したファイルなので、スタイルのオーバーライドを開始できます。

foundation.js またはfoundation.css に触れることはお勧めしません。将来のオプションのためにアップグレードすることはできません。または、ブレーキをかけたくないものをブレーキする可能性があります。ハッピーコーディング！

于 2013-03-04T20:05:12.077 に答える
1

実際、Foundation (または主要なフレームワーク) でスタイルをオーバーライドする最良の方法は、SASS および/または Compass バージョンを使用することです。(または、Bootstrap のスタイルを作ろうとしている不幸な人には LESS)

_settings.scss ファイルを調べて色、高さ、ブレークポイントを変更する方が、必要なものをすべて上書きしたことを確認するために何千行もの CSS コードを苦労して試すよりもはるかに簡単です。

はい、すべてをセットアップするのは少し学習曲線ですが、長期的には時間を節約できます.

于 2014-03-11T15:39:42.697 に答える