div 내의 페이지에 대한 CSS 크기 설정

나는 이와 같은 코드를 가지고 있습니다. 원본 이미지의 크기, 이미지와 div 결과div 내의 페이지에 대한 CSS 크기 설정

<div> 
    <img style="max-width:90%" src="..." /> 
</div>

가 함께 가압된다.
원래 이미지 너비가 100 픽셀이면 표시된 이미지의 너비는 90 픽셀에 불과합니다.

나는 그것이 일어나는 이유를 안다; css를 %로 설정하면 육아 블록의 너비를 나타냅니다.
내가 알고 싶은 것은; 어떻게하면 div가 아닌 페이지를 참조 할 수 있습니까?

내 솔루션은 페이지 너비를 확인하고 페이지 너비의 90 %를 계산 한 후 픽셀 너비를 설정하는 JavaScript를 작성하는 것입니다.하지만 더 쉬워야한다고 생각합니다.

편집 : 레코드에 대해 이것은 내 JS 솔루션이됩니다.

<script> 
    var maxw = 0.5*screen.availWidth; 
    var maxh = 0.5*screen.availHeight; 

    document.write('<style type="text/css">#lightboxImage { max-width:' + maxw + 'px; max-height: '+maxh+'px; } </style>'); 
</script>

출처

2011-05-12 DamnYankee

컨테이너 div float 또는 당신이 좋아 배치하고 페이지의 흐름에서 그것을 취할 position:absolute를 사용 (그래서 그 길에서 모든 콘텐츠를 밀어하지 않습니다) 수 시도 위치 : 절대; – user489872

문서 트리에서 상위 컨테이너에 대해 선언 된 절대 너비 값이있는 경우 백분율이이 값과 관련됩니다. –

@DamnYankee : 대답에 ** 코드 블록 **을 포함 시키려면 코드의 모든 줄을 네 칸 씩 들여 쓰기하십시오. ''를 사용하는 대신에. 감사! –

<div style="width:100%;"> 
<img src="http://www.website.com/image.jpg" style="max-width:50%;/> 
</div>

당신이 100%에 포함 DIV의 크기를 설정하면 다음 이미지의 max-width:가 전체 페이지의 50% 계산합니다.

당신은 당신이 할 수있다

출처

2011-05-12 15:20:19

div 내의 페이지에 대한 CSS 크기 설정

답변

관련 문제