1. ホーム
  2. ハイパーリンク

[解決済み】CSSでテキストを挿入する方法

2022-04-03 12:08:43

質問

CSSは比較的新しいもので、テキストのスタイルや書式を変更するために使用しています。

今度は、以下のようにテキストを挿入するために使用したいと思います。

<span class="OwnerJoe">reconcile all entries</span>

として見せられるようになればいいなと思います。

ジョーのタスク:すべてのエントリを照合する

つまり、クラス "オーナー Joe" であることを理由に、テキスト Joe's Task: を表示させる。

みたいなコードでできるんだけど。

<span class="OwnerJoe">Joe's Task:</span> reconcile all entries.

しかし、これではクラスとテキストの両方を指定するのはひどく冗長な気がします。

私が求めているようなことは可能なのでしょうか?

EDIT 一つのアイデアとして、ListItemとしてセットアップしてみるのも良いでしょう。 <li> ここで、"bullet" は、テキスト "Joe's Task"です。 様々な箇条書きのスタイルや、箇条書きのための画像を設定する例を見かけますが、どのようにすればよいのでしょうか? リスト・ブレットに小さなテキストブロックを使用することは可能でしょうか?

どのように解決するのですか?

ありますが、CSS2が使えるブラウザ(主要なブラウザ、IE8以上)が必要です。

.OwnerJoe:before {
  content: "Joe's Task:";
}

しかし、私はむしろこれにはJavascriptを使うことをお勧めします。jQueryを使って。

$('.OwnerJoe').each(function() {
  $(this).before($('<span>').text("Joe's Task: "));
});