html - HTMLボタンのテキストの一部に色を追加します

Question

hmtlボタンがたくさんあり、「タイトル*」のような値を持つものもあります。星を赤に、残りのテキストを黒にしたいと思います。これは可能ですか？

私はテキストを色付けするためのこのコード提案を見つけました：

<form>
<input type="button" value="this is a styled text button" style="color:#fff;">
</form>

このようなものを変更して、値のテキストの一部のみが影響を受けるようにすることはできますか？

Answer 1

他の人が提案したように、スパンを使用する必要があります。styleただし、属性でインラインcssを使用することは完全に避けます。代わりにクラスを使用してください。使用法のコンテキストを知らずにCSSを正確に適用する方法を推奨するのは難しいですが、以下は例です。

HTML：

<button class="starred">Title <span>*</span></button>

CSS：

button.starred span { color: #f00; }

Answer 2

*それを次のようなスパンに入れてください

<button type="button">Title <span style="color:red;">*<span></button>

アップデート ：

 <style>button>span{style="color:red;"}</style>
    <button type="button">Title <span>*<span></button>

Answer 3

代わりに、タグ<input type="button"/>を使用して、そのラベルのスタイルを設定できます。<button>

<button>Title<span style="color:#f00">*</span></button>