div의 내용을 백분율로 조정 하시겠습니까?

div의 내용을 백분율로 조정 하시겠습니까?

---

사용자가 페이지 레이아웃을 구축하기 위해 상자를 이동할 수있는 일종의 CMS 구축 (어쨌든 기본 아이디어).

데이터베이스에서 실제 내용을 가져 와서 "페이지"를 작성하고 싶지만 50 % 크기로 표시하고 싶습니다.

나는 2 세트의 CSS를 가질 수 있다는 것을 알고 있습니다. 하나는 실제 전면 페이지 용이고 다른 하나는 관리 도구 용이며 그에 따라 모든 것을 축소 할 수 있지만 유지 관리가 고통스러운 것 같습니다.

나는 어떤 종류의 jquery 또는 CSS 또는 div를 채우고 50 % 규모의 속성 (?)을 부여 할 수있는 것이 있기를 바랐습니다.

---

간단히 확대 / 축소 속성을 사용할 수 있습니다 .

#myContainer{
    zoom: 0.5;
    -moz-transform: scale(0.5);
}

myContainer에는 편집중인 모든 요소가 포함됩니다. 이것은 모든 주요 브라우저에서 지원됩니다.

---

이 크로스 브라우저 라이브러리는 더 안전 해 보입니다. 확대 / 축소와 moz-transform은 jquery.transform2d의 scale ()만큼 많은 브라우저를 다루지 않습니다.

http://louisremi.github.io/jquery.transform.js/

예를 들면

$('#div').css({ transform: 'scale(.5)' });

최신 정보

OK-사람들이 설명없이이 투표에 찬성하는 것을 봅니다. 여기에있는 다른 대답은 이전 Safari (Tiger를 실행하는 사람들)에서는 작동하지 않으며 일부 오래된 브라우저에서는 일관되게 작동하지 않습니다. 즉, 크기를 조정하지만 매우 픽셀 화되거나 이동하는 방식으로 작동합니다. 다른 브라우저와 일치하지 않는 방식으로 요소의 위치.

http://www.browsersupport.net/CSS/zoom

또는이 질문을보세요.이 질문은 다음과 같을 수 있습니다.

크로스 브라우저 CSS 줌을위한 완벽한 스타일

참고 URL : https://stackoverflow.com/questions/17333254/scale-the-contents-of-a-div-by-a-percentage