CSS hover 속성이 무시되었습니다.

사람이 왜 이것이 작동하지 않는지 알 수 있습니까? 이 예제의 경우 상자 위에 마우스를 올리면 상자가 흰색으로 변합니다.CSS hover 속성이 무시되었습니다.

<style type="text/css" media="screen"> 
    .center { 
     margin: 0 auto; 
    } 
    .box { 
     width: 250px; 
     height: 250px; 
     display: block; 
     background: #000; 
     border: 1px solid white; 
     float: left 
    } 
    .inner { 
     width: 175px; 
     height: 175px; 
     display: block; 
     margin-top: 15%; 
     margin-left: 15%; 
     background: #fff; 
     position: relative 
    } 
    .boxLink { 
     position: absolute; 
     left: 0; 
     right: 0; 
     margin-left: auto; 
     width: 100%; 
     text-align: center; 
     line-height: 175px; 
     font-size: 30px 
    } 
    a:link.boxLink { 
     color:#000; 
     background: yellow 
    } 
    a:visited.boxLink { 
     color:#000; 
     background: yellow 
    } 
    a:hover.boxlink { 
     color:#fff; 
     background: white 
    } 
    a:active.boxLink { 
     color:#000; 
     background: green 
    } 
</style> 
</head> 
<body> 
    <div id="container"> 
     <div class="box"> 
      <div class="inner"> 
       <a class="boxLink" href="#">about</a> 
      </div> 
     </div> 
    </div>

출처

2010-07-18 Zac

작동하지 않습니다. 테스트 사례를 줄이기 위해 너무 많은 감소를 한 것 같습니다. (당신은 * : 방문한 스타일을 캐스 캐 이드 아래로 내려 놓으면 : hover 스타일) 일반적인 오류를 만들지 않았습니다. – Quentin

명확하게하기 (코드에 * box * 요소가 있기 때문에) : ** 링크 ** 만 흰색 배경을 갖습니다. –

저에게 맞습니다 (Mac OS X의 Chrome 및 Safari에서 테스트 됨). 어떤 브라우저를 사용하고 있습니까? – quantumSoup

당신은:hover하기 전에 클래스 이름 을 넣어해야합니다

a.boxlink:hover {color:#fff; background: white}
: 내 제안은 좋은 방법이지만
이
a.boxLink:link{color:#000; background: yellow} a.boxLink:visited{color:#000; background: yellow} a.boxLink:hover {color:#fff; background: white} a.boxLink:active {color:#000; background: green}

, 당신은 실제로 hover 라인에 맞춤법 오류했다
CSS는 입니다. 대소 문자 구분 인 경우 l을 대문자로 지정해야합니다.

출처

2010-07-18 07:46:56

ack @! 나 피곤해. 감사! 다른 pseduoClasses가 틀린 체재를 사용했다는 것을 재미있는.. 단지 공중 선회는 묵살되었다. – Zac

사양에서 그것은 어디에서 말하는가? 아니면 특정 브라우저의 버그에 대해 이야기하고 있습니까? – Quentin

@David Dorward 당신 말이 맞아요. (CSS2.1 셀렉터 구문 (http://www.w3.org/TR/CSS2/selector.html#selector-syntax)) "간단한 셀렉터는 타입 선택기 또는 유니버설 selector 다음에는 즉시 0 개 이상의 속성 선택자, ID 선택자 또는 의사 클래스가 ** 모든 순서로 ** 표시됩니다. " – FelipeAls

CSS hover 속성이 무시되었습니다.

답변

관련 문제