テンプレートのcssの色より優先させる

Question

bootstrapでテンプレートを利用しるのですが、テンプレートのデフォルトのcssで文字に色がついており、一箇所だけ色を変えるという方法がわからず困っています。
リンクのリスト1,2,3の部分の文字色だけを変えたいのですが、やり方を教えてください

                            <td>
            				    <div class="dropdown">
                                	<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">
                                		ドロップダウン
                                		<span class="caret"></span>
                                	</button>
                                	<ul class="dropdown-menu" role="menu">
                                		<li role="presentation"><a href="#">リンクのリスト１</a></li>
                                		<li role="presentation"><a href="#">リンクのリスト２</a></li>
                                		<li role="presentation"><a href="#">リンクのリスト３</a></li>
                                	</ul>
                                </div>
            				</td>

Comments

[kei344]

まだ質問が「受付中」になっていますが、いったん「解決済」にされてはいかがでしょうか。また、解決されていないなら状況を質問文に追記ください。

Answer 1

CSSの優先度を覚えておくと後々役立ちますよ。

• CSSセレクタの優先順位の計算方法 - Qiita
• ご存知、ないのですか？CSSの優先順位

というわけで、今回の場合は <a> タグに id を振って、その id に対し color を指定すればよいと思います。

Comments

[renren643]

回答ありがとうございました。カラーはhead内に
<style type="text/css">
　#aaa { color: blue; }
</style>
とし、色を変えることができました。
今回はhead内で変えたのですが、body内で色を変える方法はあるでしょうか？

[miyahan]

もしサーバーのファイルをいじれない・テンプレートが定まっておりHTMLファイルすら自由にいじれない等の制約があるならば、次のように直接HTMLに埋め込む方法があります。

<a href="page1.html" style="color: blue;">リンク１</a>

ですがそういった制約がないのであれば、今回のようなカスタマイズ用スタイルを記述したCSSファイルを別に作り、bootstrap のCSSファイルと一緒に読み込ませるのが一般的です。

[renren643]

最終的にはruby on railsで実装したいので、できればhead内には書き込みたくないんですよね。。。。

詳しい回答ありがとうございました。

[miyahan]

？

よくわかりませんが、Rails を使うからこそCSSファイルを用意しておいてその取り扱いをRailsにおまかせするところだと思いますが。。