無法使用 sup 標簽使商標符號加粗

Question

我實際上是在嘗試將商標符號加粗並嘗試了以下選項。 但是，它不起作用，不確定我還能嘗試使商標符號加粗嗎？ 請有任何建議。

Option 1  : <p>This text contains <strong><sup>&#174;</sup></strong> text.</p>
Option 2  : <p>This text contains <b><sup>&#174;</sup></b> text.</p>

Answer 1

您的代碼使它變得粗體，但 ® 太小（尤其是在上標中），很難看出區別。 下面的代碼片段顯示了確實使符號加粗的代碼（第一行），以及沒有<strong>標簽的相同代碼（第二行）以顯示視覺差異。 兩者都被放大了。

請注意，某些 fonts 已經將 ® 符號顯示為上標。 （例如 Consolas 和 Calibri） Helvetica（StackOverflow 上的主要字體）和 Times New Roman（大多數瀏覽器中的默認字體，也適用於 Stack 代碼片段）不會將 ® 符號顯示為凸起。 重點是：確保您使用的字體尚未使其成為上標。

如果您希望符號比字體的粗體樣式更粗體，則需要為符號使用不同的字體或使用圖像。

 <p style="font-size:200%">This text contains <strong><sup>&reg;</sup></strong> text.</p> <p style="font-size:200%">This text contains <sup>&reg;</sup> text.</p>

Answer 2

你這樣做的方式應該有效。 但就我而言，它幾乎不引人注意（但絕對是一個小變化）。

如果樣式被覆蓋，您可以嘗試使用 css 使其粗體。

-- HTML
<p>This text contains <span class="bold-text"><sup>&#174;</sup></span> text.</p>

-- CSS
.bold-text {
    font-weight: bold !important;
}

或者，您可以改用圖像。
<p>This text contains <img src="restricted.png" alt="restricted image"> text.</p>

只是一些建議。

Answer 3

作為替代解決方案，您可以使用FontAwesome ，它提供免費且輕量級的圖標。 請參閱有關如何使用它的文檔。