11

text-shadow9 つの異なる色のボタン (赤、オレンジ、黄、緑、青、紫、ピンク、オフホワイト、スレート) があり、これらのボタンの CSS プロパティの色のみを操作および変更できるかどうか疑問に思っていました。他の値を同じに保ちながら?

たとえば、2 つの異なるクラスがあります。1 つはフォント サイズが 11 ピクセルのボタン用で、もう 1 つはフォント サイズが 14 ピクセルのボタン用です (私の Web サイト全体の標準)。

.button-11 {
    font-size: 0.8em;
    border-width: 0.09091em;
    border-style: solid;
    padding: 0 0.90909em;
    text-shadow: 0.09091em 0.09091em 0 rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 -0.09091em rgba(255, 255, 255, 0.3) inset;
    -moz-box-shadow: 0 -0.09091em rgba(255, 255, 255, 0.3) inset;
    box-shadow: 0 -0.09091em rgba(255, 255, 255, 0.3) inset;
}

.button-14 {
    border-width: 0.07143em;
    border-style: solid;
    padding: 0 0.71429em;
    text-shadow: 0.07143em 0.07143em 0 rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 -0.07143em rgba(255, 255, 255, 0.3) inset;
    -moz-box-shadow: 0 -0.07143em rgba(255, 255, 255, 0.3) inset;
    box-shadow: 0 -0.07143em rgba(255, 255, 255, 0.3) inset;
}

知らない人のために、私は 2 つの別個のクラスを持っています。これは、em 測定を使用しているため、フォント サイズごとに境界線とテキスト シャドウに異なる値が必要であるためです。サイズ14px。

text-shadowそのため、CSS ファイルのサイズを削減するために、他の値を含めずに CSS プロパティの色を変更できれば非常に役立ちます。

これが可能かどうか誰にもわかりますか?

ありがとうございました。

4

4 に答える 4