인라인 CSS를 사용하여 활성 상태에있는 버튼의 색상을 변경하는 방법은 무엇입니까?

인라인 CSS를 사용하여 활성 상태 (즉 클릭 된 상태) 일 때 버튼의 배경색 및/또는 테두리 색상을 변경할 수있는 방법이 있습니까?인라인 CSS를 사용하여 활성 상태에있는 버튼의 색상을 변경하는 방법은 무엇입니까?

<button class="btn btn-xs btn-primary btn-inverse dropdown-toggle" type="button" data-toggle="dropdown" style="margin-top: 12px; background-color: rgba(0, 0, 0, 0); border-color:rgba(0, 0, 0, 0); margin-right:20px">

이 같은 있지만, 버튼을 클릭 할 때 뭔가? 이 활성 상태 (즉, 클릭 수) 인라인 CSS를 사용하여에있을 때

출처

2016-09-22 Potterapple

아니요 ... 기본 상태에 대해서만 인라인 CSS를 제공 할 수 있습니다. 다른 것에 필요한 변경 사항은 스타일 시트에 있거나 스타일 태그 안에 있어야합니다. –

어떻게 할 수 있습니까? 스타일 태그 안에? – Potterapple

다음을 사용하십시오 : 활성 셀렉터 –

을 baground에 변경 CALSS에 :active을 사용할 수 있습니다

css :active이 인 CSS 유사 클래스이 아니고 Dom property or attribute이 아니라는 점을 감안하면 인라인과 동등한 것을 할 수 없습니다.

그러나 귀하의 경우, 클릭 이벤트가 유효한 대안이 될 수 있다면, 당신이 뭔가를 할 수 있습니다 ...

<script> 
 
    function toggleBg(element, color) { 
 
    if(!color) { 
 
     color = element.dataset.normalColor; 
 
    } else { 
 
     element.dataset.normalColor = element.style.backgroundColor; 
 
    } 
 

 
    element.style.backgroundColor = color; 
 
    } 
 
</script> 
 

 
<button onmousedown="toggleBg(this,'red')" onmouseup="toggleBg(this)">RED ON PRESS</button>

그냥 메모, 인라인 스타일 또는

<style> 
 
    button:active { background: red; } 
 
</style> 
 

 
<button>RED WHEN ACTIVE</button>

: 당신이 CSS를 사용할 수 있는지 인라인 자바 스크립트, 좋은 방법이 아닙니다

출처

2016-09-22 13:01:55 Hitmands

답변 해 주셔서 감사합니다. 인라인 스타일이 신의 연습이 아닌 이유는 무엇입니까? – Potterapple

http://stackoverflow.com/questions/2612483/whats-so-bad-about-in-line-css – Hitmands

당신은 버튼의 배경색 및/또는 테두리 색상을 변경할 수 없습니다, 당신은 색상 또는 테두리 색상을

출처

2016-09-22 13:00:39 Nitrick

에 대한 복제본이어야합니다 답변 해주셔서 감사합니다! btn : active inline에 액세스 할 수없는 이유가 있습니까? – Potterapple

우리는 btn을 사용할 수 없다고 생각합니다 : active는 버튼을 클릭 한 후에 발생하는 이벤트이며 css 나 js 만 트리거하여 발생합니다. 즉, 클래스는 인라인으로 제대로 렌더링되지 않습니다. 그래서 우리는 그것을 사용할 수 없습니다. – Nitrick

인라인 CSS를 사용하여 활성 상태에있는 버튼의 색상을 변경하는 방법은 무엇입니까?

답변

관련 문제