2014-01-15 4 views
1

나는 비어있는 내용을 담고 있어야하며, 부모 배경에서 너비 배경 소스를 가져온 후에 pseudo 요소를 포함해야합니다. 여기 은 예입니다 html로attr 배경 이미지가있는 의사 요소

<div class="slide-image" href="#adad" data-src="some-src"></div> 

나는 많은 다른 방법을 시도 한 CSS

.slide-image { 
     overflow: hidden; 
     height: 100%; 
     width: 100%; 
    } 
    .slide-image:after { 
     content: ""; 
     background-color: #c2c2c2; 
     display: inline-block; 
     color: red; 
     height: 100%; 
     width: 100%; 
     background-image: attr(data-src url); 
    } 

하지만, 그것이 작동 할 수 없습니다.

+1

을()''이외의 값으로 content' 블록은 여러 브라우저에서 지원되지 않습니다. – 412

+1

... 인라인 CSS보다 개선 된 부분이 아니기 때문에 다른 용도로 사용할 이유가 없습니다. – Blazemonger

+0

JavaScript로만 이렇게 할 수 있다는 것을 의미합니까? – JAYBEkster

답변

0

DIV를 높이와 높이로 고정해야합니다.

<div style="width: 200px; height: 200px;"> 
    <div class="slide-image" href="#adad" data-src="some-src"></div> 
</div> 

또는 높이와 높이를 고정시킨 슬라이드 이미지를 제공하십시오.

예를 참조하십시오 :`ATTR를 사용

http://jsfiddle.net/SupY8/