2013-08-28 2 views
7

알려주세요 폭과 높이는 100 %입니다. 오른쪽 하나는 div이고, :before:before의 너비와 높이도 100 %이지만 효과는 다릅니다!CSS 의사 요소 크기 문제가

(I 내가 background-image 해결 방법을 사용할 수 있습니다 알고 있지만 content 속성이 url():pseudo에 어떤 문제가 있는지?)

가 바이올린 : http://jsfiddle.net/Tp9JG/4/

+0

나는 이것으로 곤혹 스럽지만'width'와'height'는'url()'을 통해 삽입 된 이미지에는 적용되지 않습니다. http://stackoverflow.com/questions/14978807 – xec

+0

@xec thanks http://lists.w3.org/Archives/Public/www-style/2011Nov/thread.html#msg451 – Cherniv

+0

또한 당신이'디스플레이를 만들기 위해 선택 width' 경우'제어 할 수 있습니다 : Tomzan에,이 발견 인라인 ;'. – connexo

답변

4

불행히도 이미지의 크기를 제어 할 수 없습니다 지정할 때 그 내용 통해하지만 당신은 당신이 배경으로를 사용 할 수있는 경우 :

.with_before:before{ 
    content:''; 
    background-image: url('http://i.stack.imgur.com/CAAFj.jpg'); 
    background-size: 100% 100%; 
    width: inherit; 
    height: inherit; 
    display: inline-block; 
} 

확인이 0

우리가하지 스타일 콘텐츠를 생성 할 수있는 이유 질문에 대한: 우리가 생성 한 콘텐츠가 생성 된 박스로 렌더링하고 상자 스타일,하지만 내용입니다 수 없기 때문에.

참조 :

  1. check this post
  2. another lengthy discussion on this subject

서로 다른 브라우저를 주목하시기 바랍니다 매우 다른 행동을 보여줍니다.