CSS에서 마우스를 올리면 svg 파일이 나타나지 않습니다.

제 경우에는 2 개의 별도 svg 아이콘 파일이 있습니다. 그들 중 하나는 흰색, 다른 하나는 주황색입니다.CSS에서 마우스를 올리면 svg 파일이 나타나지 않습니다.

이것은 아이콘의 첫 번째 상태입니다.

.c-icon-not-favorite { 
    background-image: url("../img/poster_fav_icon_white.svg"); 
}

이것은 가리키는 동작입니다.

.c-icon-not-favorite:hover { 
    background-image: url("../img/poster_fav_icon_orange.svg"); 
}

오렌지색 svg 아이콘이 표시되지 않습니다. 이 문제를 해결하려면 어떻게해야합니까? 나는 잠시 동안을 찾고있다. 나는 아직 풀지 않았다.

은 ------ 편집 -----

나는 .c-icon-not-favorite 클래스에 추가 여분의 특성과 그 문제를 해결했다. 속성은 다음과 같습니다. width, height, position: absolute, top:0, right:1%. 그 후 그것은 완벽하게 작동했습니다. 그것은 말도 안돼.

조언 해 주셔서 감사합니다.

출처

2017-05-04 Yasin Yörük

문제를 설명하는 질문에 [mcve]를 추가하십시오. –

이미지 링크가 작동하고 있습니까? –

@RobertLongson 죄송합니다. 우리 회사의 비장 한 프로젝트입니다. 그리고 로컬 서버에서 작동합니다. 따라서 demostration을 위해 복제하는 데 오랜 시간이 걸립니다. 정말 미안해. –

코드가 정확합니다. 문제는 이미지 파일 자체에있을 가능성이 큽니다.

.c-icon-not-favorite { 
 
    width: 100vw; 
 
    height: 100vh; 
 
    background-image: url("https://upload.wikimedia.org/wikipedia/commons/6/67/Apollo_17_Image_Of_Earth_From_Space.jpeg"); 
 
    background-position: center; 
 
    cursor: pointer; 
 
} 
 

 
.c-icon-not-favorite:hover { 
 
    background-image: url("http://www.publicdomainpictures.net/pictures/30000/velka/dandelion-133684137252N.jpg"); 
 
    }

<div class="c-icon-not-favorite"></div>

클래스를 가진 div 태그 안에 당신의 SVG와

출처

2017-05-04 13:47:37

를 적어 img 태그. div 태그를 가져 가면 img 태그를 숨기고 배경 이미지를 보여줍니다. 기본적으로 SVG로 img 태그를 보여줍니다.

출처

2017-05-04 16:35:38 Super

CSS에서 마우스를 올리면 svg 파일이 나타나지 않습니다.

답변

관련 문제