CSS：hslの色を使って1つの値だけを変更する方法

hslを使用して特定の値のみを調整する方法はありますか？たとえば、彩度や明度を変更して色相を同じにしたい場合は、CSS：hslの色を使って1つの値だけを変更する方法

.red { 
    background-color: #ff0000; /* or, hsl(0,100%,50%); */ 
} 
.red-dark { // Adjust saturation +10% and lightness -15% 
    background-color: hsl(, +10%, -15%); 
}

出典

2017-01-23 JROB

一般に、意図された使用ではなく色でクラスを命名するのは悪い習慣です。しかし、あなたが探しているのは、SASSのようなもので、変数を使用して割り当てることができます。そして、あなたに役立つ機能が組み込まれているようです。同様に、このSOの投稿に表示される►http://stackoverflow.com/questions/1625681/dynamically-change-color-to-lighter-or-darker-by-percentage-css-javascript – Nope

あなたはフランで述べたように、sassようjavascriptまたはCSSプリプロセッサを使用する必要があります。

CSSは宣言的であり、以前の状態を少し例外的に参照していません。ほとんどの場合、それは与えられたものだけを実行します。

出典

2017-01-23 18:05:03

CSS：hslの色を使って1つの値だけを変更する方法

答えて

関連する問題