2011-08-24 6 views
7

HTML 레이블 위로 마우스를 가져 가면 마우스 포인터가 일반적으로 링크를 클릭 할 때 나타나는 손 이미지로 바뀝니다. 어떻게 피할 수 있습니까? 대부분의 브라우저에서 label 요소의 주요 목적 중 하나가 폼 입력 요소에 대한 클릭 할 수있는 설명을 제공하기 때문에레이블 위로 마우스를 가져 가면 마우스 포인터가 손 모양으로 바뀝니다

+5

마크 업을 게시 할 수 있습니까? –

+2

어떤 브라우저를 사용하십니까? 이것은 나를 위해 일어나지 않습니다 ... http://jsfiddle.net/ymZnt/ –

답변

21

일부 브라우저에서 손 커서를 얻을 수있는 이유이다. 예를 들어,이 <label> 요소의 전형적인 사용하는 것입니다 : 대부분의 브라우저에서

<input type="checkbox" name="TermAgreement" id="TermAgreement" /> 
<label for="TermAgreement">I agree to these terms</label> 

는,이 텍스트가 발생합니다 클릭 할 수있는 "나는이 약관에 동의". 텍스트를 클릭하면 확인란 자체를 클릭 한 것처럼 ID가 TermAgreement 인 확인란이 토글됩니다.

(참고 :.. The W3C specification for <label> in HTML 5이 동작을 필요로하지 않지만,이 <label>의 브라우저의 구현은 "플랫폼의 라벨 행동과 일치한다"고 말하는가 실제로, 이것은 일반적으로 <label> 요소가 클릭을 의미)

따라서 본질적으로 커서는 <label>이 링크 인 것처럼 동작합니다. 이므로 링크입니다. 다르게 사용하는 경우 다른 HTML 요소를 대신 사용해보십시오.

레이블을 마우스로 이동할 때 특정 사용자가 손 모양 커서를 볼 수 있는지 여부는 OS 및 브라우저에 따라 다릅니다. Windows XP에서는 Chrome 및 Firefox가이 동작을 표시하지 않지만 다른 플랫폼에서는이 동작을 표시하지 않을 수 있습니다. 또한이 동작을 특별히 요구하는 CSS 파일이 포함되어있을 수 있습니다. @rickyduck 말했듯이, 당신은 요소의 기본 동작을 재정의하려면

label { 
    cursor: pointer; 
} 

, 당신이 당신의 CSS에서 cursor: default;를 사용할 수 있습니다 다음과 같은 형태 당신의 CSS의 규칙이있을 것입니다. 당신은 find information on the CSS cursor property here 일 수 있습니다. 커서를 변경해도 요소가 클릭에 응답하지 않는다는 것을 의미하지는 않습니다.

그래도 문제가 해결되지 않으면 저희에게 자세한 정보를 제공해주십시오. 샘플 코드, 비헤이비어를 표시하는 페이지의 URL은 물론 사용중인 브라우저도 알아두면 좋을 것입니다.

15

<label style="cursor:default">Text<label>

+3

무의미한 투표의 일종, 그것은 질문에 대답 ... – rickyduck

+0

대답은 높은 품질입니까? –

+8

질문이 있습니까? – rickyduck

관련 문제