3

HTMLを使用して、テキストの各選択が内部にあるタグに従ってテキストの色を混合する方法はありますか？この擬似コードは、私が作成しようとしているテキストの混色のタイプを記述しています。

<red>
    This text should be red.
    <blue>
        This text should be purple, since it is inside red and blue tags.
    </blue>
    This text should be red.
    <white>
        This text should be pink, since it is inside white and red tags.
    </white>
</red>

この擬似コードを有効なHTMLに変換して、テキストの色をこのように組み合わせることができますか？

4

2 に答える 2

4

スクリプトなしではなく、動的に。ただし、いくつかのCSSルールを定義することはできます。

.red {
    color: red;
}
    .red .white,
    .white .red {
        color: pink;
    }
    .red .blue,
    .blue .red {
        color: purple;
    }
.blue {
    color: blue;
}
    .blue .white 
    .white .blue {
        color: light-blue;
    }

等

これは、必要に応じて単純または複雑にすることができます。

編集：これがデモンストレーション用のjsfiddleです：http：//jsfiddle.net/LhSk2/

于 2013-01-27T04:26:45.027 に答える
1

IE8以下をサポートする必要がない場合は、半透明のRGBAカラーを使用できます。

<div style="background: red">
    This text should be red.
    <div style="background: rgba(128, 0, 128, .5)">
        This text should be purple, since it is inside red and blue tags.
    </div>
    This text should be red.
    <div style="background: rgba(255, 255, 255, .5)">
        This text should be pink, since it is inside white and red tags.
    </div>
</div>

これがフィドルです：http：//jsfiddle.net/zT8JD/

于 2013-01-27T04:16:42.573 に答える