2012-05-05 4 views
0

고객을위한 웹 사이트 디자인을 마친 후, 모든 것이 다소 작다는 것을 깨달았습니다. 브라우저 확대/축소를 실험 한 결과, 10 % 확대가 많이 고정 된 것을 발견했습니다! 문제는, 모든 크기 (div 크기, 이미지 크기, 텍스트 크기 등)를 110 %로 조정하는 방법을 알아낼 수 없다는 것입니다.확대 웹 사이트 확대 10 %

모든 아이디어는 높이 평가됩니다. 나는 CSS에서 이것을 모두하는 것을 선호 할 것이다.

편집 -

하하, OK 사람이, 난 그냥 가서 실제로 크기를 변경 시간을 보낼 것 같아요. 내가하고 싶었던 것이 아니라 그것이 나의 유일한 실제 옵션이라고 생각합니다. 고마워 :)

+3

를? –

답변

3

올바른 방법은 웹 사이트를 다시 디자인하는 것입니다. 올바르게 설계 한 경우 매우이되어야합니다.조언 :

  • 페이지 폭 : 당신의 가장 바깥 쪽 컨테이너의 폭을 증가는 자식 요소는 사용자가 설정 한 절대 폭을 하드 코딩하지 않는 공간을 채우기 위해 확장한다 너비. 이 경우 px을 조정하십시오.

  • 글꼴 크기 : 당신이 em 또는 % 값을 사용한 경우, 단지 font-sizebody의 증가 (다른 요소가이 기본 글꼴 크기를 상속합니다). 글꼴 크기로 px을 사용한 경우 글꼴 크기를 늘려야합니다.

난 당신이 자바 스크립트 또는 IE zoom 속성을 통해 페이지가 올바른 접근 아니다 "확대"하고 재 설계를 피하는 것을 아래로 깊이 알고 있다고 생각. body{ transform:scale(1.1); }과 같이 이미지를 확대/축소 할 때 이미지가 흐리게 보이게하고 CSS3 이후로는 지원이 부족하고 after testing this idea은 뷰포트/보이는 영역 밖으로 콘텐츠를 확대 할 수있는 것으로 보입니다.

영구 변경하려는 경우 올바른 방법은 CSS를 다시 작성하는 것입니다.

+1

좋아, 나는 게으르지 않고 실제로 고칠 것 같아. 내 안 느낌으로 나를 불러내는데 3 +1. . – FreeSnow

2

당신이 정말로 내가 내 최근의 대답에 당신을 referr 그렇게하려면 내가

(글꼴 크기 10px까지 등을 설정)을 다른 방법으로 문제를 해결하기 위해 제안하지만 것 비슷한 문제. FF는 js를 통한 확대를 허용하지 않기 때문에 FF가 이것을 지원하지 않기 때문에 조심하십시오!

imitate browser zoom with JavaScript

은 [여기 요 :] [1]

사용 :

document.body.style.zoom=1.0;this.blur(); 

1.0 100 %를 의미

150 % 1.5 1천퍼센트이 될 것입니다 10.0

this.blur ()는 커서가 입력 필드를 선택한 경우 이 모든 선택 항목의 포커스를 잃어 버렸음을 의미합니다.

나 :

당신은 [4] 브라우저로 확대 [줌] [2] ([출처]가 [3])

[파이어 폭스는 허용하지 않습니다]를 CSS3 요소를 사용할 수 있습니다 당신이 할 수 있기 때문에 ' '은 javascript 또는 sth를 통해 사용자 속성에 액세스합니다.

위와 같이 확대/축소 (CSS3 : zoom, ) 할 수있는 CSS 스타일을 사용하거나 텍스트 크기를 늘릴 수 있습니다. 예를 들어 다른 CSS 파일을 포함하여 을 할 수 있습니다. 하지만 여기에 "jumpy"문제가 있습니다. 스타일이 지정된 CSS 요소 (부동 등)의 속성이 실제로 서로 다른 "상호 작용할" 이기 때문입니다.

I 상기 등록한 줌 크롬과 IE8 +에서 잘 작동

(FF 언급로 지원되지 )

[1] : http://www.perlunity.de/javascript/scripts/javascript_0314_main.shtml [2] : http://www.css3.com/css-zoom/ [3] : Can I zoom into a web page like IE or Firefox do, using programming? [4] : http://www.mozilla.org/projects/security/components/signed-scripts.html

+2

확대/축소 설정을 변경하여 디자인을 수정하려고하는 것은 정말로 나쁜 생각입니다. – jjrv

+0

내가 말했듯이 .... "나는 다른 방식으로 문제를 해결할 것을 제안한다." – creativeby

1

이 모든 가치-동안 브라우저의 200 % 규모로 화면에있는 모든 크기를 조절 : 10 % 크게 모든 크기의 값을 변경 뭐가 잘못

body { 
    -moz-transform: scale(2); 
    -webkit-transform: scale(2); 
    -o-transform: scale(2); 
    -ms-transform: scale(2); 
    transform: scale(2); 
}