2017-06-13 33 views
0

我改變背景顏色50%高度後175deg angle.So,當文字顏色變爲白色,當背景顏色是藍色。 Fiddle更改文字顏色在50%高度後175deg

.bg { 
 
     background: linear-gradient(175deg, #e2e2e2 50%, #435289 50%); 
 
     color:#000; 
 
}
<div class="bg"> 
 
<h1> 
 
Hiii, My Name is John, I love Stackoverflow. I really don't know, how to do this, Can someone help me? If Background = Blue, Text Color = White 
 
</h1> 
 
    
 
</div> 
 

 

 
</div>

+0

儘量不要只是要求某人完成你的代碼,展示你的研究,你已經做了什麼嘗試和自己解決這個問題? – Beaniie

+0

你在這方面嘗試過什麼?解決你的問題?我看到你包含JavaScript作爲你的問題的標籤。 javascript在哪裏? –

+0

當background-color = Blue時,文本顏色更改爲白色。可能嗎?怎麼樣? – Josh

回答

2

如果您需要的對比度,而不是確切的顏色,你可以使用mix-blend-mode根據背景動態地改變顏色:

.bg { 
 
    background: linear-gradient(175deg, #e2e2e2 50%, #435289 50%); 
 
    color: #000; 
 
} 
 

 
h1 { 
 
    color: #fff; 
 
    mix-blend-mode: difference; 
 
}
<div class="bg"> 
 
    <h1> 
 
    Hiii, My Name is John, I love Stackoverflow. I really don't know, how to do this, Can someone help me? If Background = Blue, Text Color = White 
 
    </h1> 
 

 
</div> 
 

 

 
</div>

+0

他們說,英雄的現實世界中並不存在。謝謝 – Josh

+0

高興地幫助:) –

1

可以專門申請該顏色。看到 https://jsfiddle.net/h7jhcbm0/2/

.bg { 
    background: linear-gradient(175deg, #e2e2e2 50%, #435289 50%); 
    color: #000; 
} 

h3 { 
    color: #fff 
} 
+0

這只是例如,我更新了問題,請參閱片段。 – Josh

+0

這正如你所描述的那樣工作..... Text =白色當背景=藍色 –

+0

我覺得在CSS中有這樣做的簡單方法。 – tech2017