ブートストラップCSSは競合しますか?

Bootstrap は、Web 上で最も人気のある CSS フレームワークです。美しくレスポンシブなデザインを非常に簡単に作成できます。ただし、Web サイト全体で Bootstrap を使用したくない場合や、Bootstrap CSS の一部のみを使用する必要がある場合があります。 Bootstrap CSS を head に直接追加すると、他の CSS と競合し、スタイルが混乱する可能性があります。

#Bootstrap CSS を特定のクラスに分離できれば、問題は解決します。 LESS を使用して、すべての Bootstrap CSS にクラス名を追加するだけです。

LESS は、CSS にコンパイルする前に変数を変更できる CSS プロセッサです。これにより、1 つの変数 (例: 基本フォント サイズ) を変更することができ、LESS はそれに依存するすべてのスタイル (例: 行の高さ、見出しなど) を自動的に調整します。

以下は、LESS を使用してブートストラップ CSS をカスタマイズし、クラス bootstrap-iso を使用してすべてのブートストラップ スタイルにプレフィックスを追加する方法を示しています。

関連する推奨事項: 「bootstrap 入門チュートリアル 」

処理手順:

1. ブートストラップ CSS ファイルを head タグにインポートします

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />

を

<link rel="stylesheet" href="https://formden.com/static/assets/demos/bootstrap-iso/bootstrap-iso/bootstrap-iso.css" />

2 に置き換えます。次に、次のように、bootstrap-iso クラスを使用して HTML を div にラップします。

以上がブートストラップCSSは競合しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。