次のような、重複するさまざまな CSS グループを追跡する何かをモデル化する良い方法を探しています。
- これは例のための単なるテスト文です。
- (これは) 単なる例の (テスト文) です。
- （これは単なる）テストです（例の文です。）
選択したラジオ ボタンに応じて、括弧内のグループごとに異なる CSS スタイルを有効にしたいと考えています。したがって、たとえば #2 の場合、(This is) は常に異なるデフォルト スタイルになり、マウスを重ねると赤色で強調表示されますが、オプション 2 が選択されている場合のみです。さまざまなオプションがあるため、必要に応じてソース テキストの複数のコピーを作成することは避けたいと思います。
問題は、スパンをオーバーラップできないことです。これを行う唯一の方法は、次のように、各単語に複数の css クラスを与えることです。
group2_word1、group3_word1 など...そして、必要な動作をシミュレートするために多くの JavaScript コーディングを行います。これは私にはひどい考えのように聞こえます。
より良い方法はありますか？