2013-11-14 6 views
0

이유는 모르겠지만 레이아웃에 로그인 버튼이 표시되지 않습니다.CSS/HTML - 배경 이미지가 작동하지 않습니다.

CSS :

.sign-in { 
    position: absolute; 
    left: 895px; 
    top: 30px; 
    width: 96px; 
    height: 36px; 
    background-image: url('button_sign-in.png'); 
} 
.sign-in:hover { 
    background-image: url('button_hover_sign-in.png'); 
} 

HTML :

<a class="sign-in" href="#" title="Sign In"></a> 

상자가 그 안에 수, 단지 어떤 이미지를 클릭하지 않습니다. 이미지는 거침없이 존재하며 html 파일과 동일한 폴더에 있습니다.

아이디어가 있으십니까? 감사!

+0

이미지가 CSS와 같은 폴더에 있습니까? 이미지의 전체 경로가 필요합니다. – Andrew

+0

두 이미지가 모두 표시되지 않습니까? – Radian

+0

파일 이름에 대시가 될 수 있습니까? (나는 그것을 의심하지만, 한 발의 가치가있다) – Tim

답변

1

HTML 파일의 위치는 관련이 없습니다.

CSS의 경로는 표시되는 HTML 파일이 아닌 CSS 파일의 위치를 ​​기준으로합니다.

예를 들어 CSS 파일이 HTML 파일 및 이미지가있는 디렉토리의 하위 디렉토리 (예 : /css)에있는 경우 url(your_image.png)에서 url(../your_image.png)으로 경로를 변경해야합니다.

Firefox 또는 Chrome 개발자 도구에서 '네트워크'탭을 열면 이미지에 대한 404 번째 GET 요청을 포함하는 네트워크 요청 목록을 볼 수 있습니다. 경로를 확인하고 그에 따라 조정할 수 있습니다.

+0

에 관련된 오류가 있는지 콘솔을 참조하십시오. 감사! CSS는 CSS 폴더에 있습니다. 나를 혼란스럽게 한 것은 Dreamweaver에서 작동하지만 브라우저에서는 작동하지 않는다는 것입니다. 고마워요! – user2987337

+0

@ user2987337 괜찮습니다! 당신이 기회를 얻을 때 답안으로 Upvote 및 마크 :) – Ennui

+0

@ Ennui는 대답을 받아들이는 것을 기대하지 않습니다. 그는 어제 질문을했다. 그것은 해결되었고 그는 받아들이지 않았다. 어쨌든 좋은 대답 +1 – Loko

관련 문제