2017-12-28 50 views
1

내가 그 텍스트의 나머지 부분보다 약간 밝은 색상을 표현하고자하는 것이 가능 그래서 예를 들어CSS 상대적인 변화는

color: inherit + #222; 

같은 일을 할 수 있나요 상속합니다. 아니면 하이퍼 링크를 가질 수있는 모든 단일 HTML 태그를 적어 두어야합니까?

+0

사용. 요소에 "test"라고하는 ID가 있다면, 다음을 수행하십시오 :'''test.style.color = your_color''' –

+0

배경과 함께 이렇게하면 부분적으로 투명한 배경색을 추가하여 부모의 배경색. 하지만 순수한 CSS를 사용하면 내가 원하는 것을 얻을 수있는 방법을 모릅니다. – Jonathan

답변

1

그럼 당신은 HSL 색상 및/또는 CSS 변수를 사용할 수 있습니다.

상세 정보 Color values이 같은 CSS Variables

뭔가.

:root { 
 
    --color: 0, 0%; 
 
    --luminosity: 0%; 
 
} 
 

 
a { 
 
    --luminosity: 50%; 
 
    color: hsl(var(--color), var(--luminosity)); 
 
    /* 
 
    Or simply 
 
    color: hsl(0, 0%, 50%) 
 
    */ 
 
}
<p>Yo i'm some random text, <a href="#">and I'm a stupid link</a></p>
그것을 자바 스크립트와

1

일반 CSS에서는이 작업을 수행 할 수 없습니다. 당신이 SCSS를 사용하는 경우, 당신은 특별한 기능

을 사용할 수 있습니다

어두운 (# 222, 10 %)와 동일한 할 수있는 자바 스크립트 밝게 (# 222, 10 %)

+0

그래서 색상 : lighten (상속, 10 %); ? – writzlpfrimpft

+0

불행히도 없습니다. 첫 번째 매개 변수는 색상을 전송하고 두 번째 백분율은 밝기를 증가 또는 감소시키는 양을 전송합니다. 그러나 색상으로 변수를 전달할 수 있습니다. – Hydrock

-1

사용 : 당신의 HTML이 보이는 경우 을 : JS에서 다음

<div id='parent'> 
    <div id='child'> 
    </div> 
</div> 

는 수행

var parent = document.getElementById('parent') 
var child = document.getElementById('child') 
child.style.color = parent.style.color + '#yourNum'