divクラス色名から色番号に変更#code

Question

カラーコードを使用したい。たとえば、赤の代わりに＃e06666と入力します。

content.push('<p><div class="color red"></div>Whole Foods Market</p>'); 

どうすればよいですか？あなたが使用する必要があります。この具体例で

Answer 1

：

.custom-color { 
    color: #e06666; 
} 

とのdivタグのクラスを設定します。

content.push('<p><div class="color" style="color:#e06666"></div>Whole Foods Market</p>'); 

しかし、それはCSSスタイルを定義するためにはるかに良いです：

content.push('<p><div class="color custom-color"></div>Whole Foods Market</p>'); 

Answer 2

content.push('<p><div style="color = #e06666"></div>Whole Foods Market</p>'); 

Answer 3

これはクラスであり、カラーリファレンスではないので、あなたのページでタグを使って定義されたCSSファイルを見つけるか、.redクラスを含むページ上にブロックがあるかもしれません。

いずれの場所でも、このような表示があります。

.red{ 
    color:red; 
} 

色を交換してください。色付きライン：＃e06666;

Answer 4

あなたはRGB to Hex and Hex to RGBを参照してください16進数のrgb()を変換し、window.getComputedStyle()を使用して"red"キーワードのrgb()値を得ることができます。

//https://stackoverflow.com/a/5624139/ 
 
function componentToHex(c) { 
 
    var hex = c.toString(16); 
 
    return hex.length == 1 ? "0" + hex : hex; 
 
} 
 

 
function rgbToHex(r, g, b) { 
 
    return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b); 
 
} 
 

 
var content = []; 
 

 
var div = document.createElement("div"); 
 
document.body.appendChild(div); 
 
div.style.color = "red"; 
 

 
content.push(`<p><div class="color ${rgbToHex.apply(null, window.getComputedStyle(div).color.match(/\d+/g).map(Number))}"></div>Whole Foods Market</p>`); 
 

 
console.log(content);