ブートストラップ ボタンの色をカスタマイズし、デフォルトのスタイルをオーバーライドする方法

Bootstrap のボタンの色のカスタマイズ

Bootstrap のデフォルトのボタン スタイルは、デザインの設定と必ずしも一致しない場合があります。 Bootstrap アプリケーション内のすべてのボタンの外観を変更するには、カスタム CSS ルールを使用できます。

Bootstrap のデフォルトのボタン プロパティをオーバーライドするには、カスタム CSS ルールに ! important フラグを追加する必要があります。これにより、スタイルがデフォルトのブートストラップ スタイルよりも優先され、元の青色に戻ってしまうことがなくなります。

すべての主ボタンとそのホバーの背景色を変更するカスタム CSS スニペットの例を次に示します。 、アクティブ、および訪問済みの状態:

<code class="css">.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited {
    background-color: #8064A2 !important;
}</code>

CSS ルールに ! important フラグを追加すると、これらのカスタム スタイルは競合するブートストラップのデフォルトをオーバーライドし、すべての主ボタンに指定された背景色が一貫して表示されるようにします。

以上がブートストラップ ボタンの色をカスタマイズし、デフォルトのスタイルをオーバーライドする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。