グローバルスタイルシートをオーバーライドする方法
-
05-07-2019 - |
質問
一言で言えば、グローバルスタイルシートがあります:
a { font-family: Arial; }
特定のリンクに異なるフォントファミリを使用したい:
<a href="..." style="font-family: Helvetica;">...</a>
または
<span style="font-family: Helvetica;"><a href="...">...</a></span>
しかし、何も機能しません。これを行う簡単な方法はありますか?
PS私は動的に(PHPを介して)異なるリンクに異なるフォントを割り当てるため、特別なクラスを作成することはオプションではありません。
解決
Helveticaという名前の特定のフォントがない限り、一部のプラットフォーム(Windowsなど、 FontSubstitutes )、HelveticaはArialのエイリアスです。それが問題の原因かもしれません。別のフォントを試してみてください。
他のヒント
最初の試み
<a href="..." style="font-family: Helvetica;">...</a>
動作するはずです。おそらくフォントが欠落していることに同意します。インラインスタイルは、ユーザー定義のスタイルシート以外のスタイルよりも優先されます。スタイル定義の優先順位は次のとおりです。
- ユーザー定義スタイル
- 埋め込みまたはインラインスタイルシート
- 内部スタイルシート
- 外部スタイルシート
- ブラウザのデフォルトスタイル
スタイルシート内の優先順位は次のとおりです。
- !importantとマークされたもの
-
id
- .class
- 要素
さらに、より具体的なルールがあります:div a
はa
を上書きします。
@Kipの提案が最善の策です。
問題がクリスが指摘したものでない限り、あなたが書いたものは動作するはずです
これが正しく機能するフォントのペアを取得したら、これを行うより良い方法は、なぜそれらを思い出させる特別なリンクのクラスを宣言することであると考えるかもしれません個別のフォントが必要です(特に注目したいのでしょうか?)
a { font-family: Arial; }
a .noticed { font-family: Helvetica; }
次にHTMLで:
<a class="noticed" href="...">...</a>
リンクの周囲にspanタグを作成してフォントを変更するか、リンクにインラインスタイルを追加して、昔の<font>
タグの一部をスマックします。
要素スタイルはグローバルスタイルをオーバーライドするため、Chris Jester-Youngがおそらく適切であり、実際にはHelveticaフォントを持っていません。別のフォントを試してください。確かに存在するクーリエまたはタイムズニューローマン