2012-11-30 10 views
0

대부분 내 웹 사이트는 상대 글꼴 및 유동적 인 레이아웃 기법을 사용하므로 사이트 레이아웃은 브라우저의 기본 글꼴 크기에 따라 확장됩니다. 그러나 고정 너비가있는 특정 요소가 있으며 특정 글꼴 크기를 넘은 레이아웃은 제대로 작동하지 않거나 잘 보입니다. 이 시점에서 되돌아 가서 모든 요소를 ​​변경하는 것은 현실적이지 않습니다.상대 최대 글꼴 크기 최대 허용 최대

그래서 특정 제한 내에서 브라우저에서 사용자가 선택한 기본 글꼴 크기를 기반으로 사이트를 조정할 수 있습니다. 예를 들어, 브라우저에서 다소 불안해지기 시작합니다. fontsize22px;입니다.이 사이트는 최대 기본 크기 인 22px에 도달 할 때까지 상대가되도록하고 싶습니다.

내가 수집 할 수있는 것으로부터, 이것을 CSS에서 완전하게 지정하는 쉬운 방법이없는 것처럼 보입니다. 가장 좋은 방법은 Javascript을 사용하여 페이지로드시 기본 fontsize을 찾은 다음 >22px 인 경우 font-size22px에 수정하는 본문 태그의 스타일을 설정합니다. 그것이 22px보다 작 으면, 나는 아무것도하지 않을 것입니다. (우리의 기본 상대 스타일을 그대로 두십시오). 페이지가로드되는 동안 글꼴 크기 변경을 처리하는 것과 관련하여 신경 쓰지 않아도됩니다 (가장자리가 다음 페이지로드시 수정 됨).

이 방법이 가장 좋은 방법입니까 아니면 더 좋은 방법이 있습니까?

답변

0

사용자가 글꼴 크기를 늘리지 못하도록 막을 수는 없습니다 (크기를 픽셀로 설정 했더라도 사용자가 Ctrl +를 사용할 수 있음) 많은 사람들이 이것이 좋다고 생각합니다. 사람들은 예상보다 큰 글꼴 크기가 필요할 수 있으며 레이아웃을 깨뜨릴 수 있습니다. 전혀 읽을 수없는 것보다 다소 좋을 수도 있습니다. 그래서 당신이 할 수있는 일은 페이지가 폭 넓은 글꼴 크기에 대해 합리적으로 작동하도록하기 위해 합당한 노력을 기울이는 것입니다.

+0

나는이 질문에 대해 충분히 이해하지 못했습니다. CTRL +/-이 페이지를 확대하고 글꼴 크기를 늘리는 것을 알고 있습니다. 전체 페이지를 확대 ('고정'레이아웃 모두 포함)하므로 모든 것이 올바르게 렌더링되고 확대됩니다. 괜찮습니다. 글꼴 크기 조정을 허용합니다. 내 몸을 고정 크기 (예 : 10 픽셀)로 설정하면 아무도 변경할 수 없습니다. 내 글꼴 크기 변수 (본문 : 69 %, 다음은 어린이 용)를 유지하고 싶지만 "기본값의 69 %"는 절대로 22px 이상이 아닌지 확인하십시오. – Dan

+0

여전히 그럴 수 없습니다. 브라우저에서 사용자가 전체 페이지를 확대하거나 텍스트 만 확대 할 수 있는지 여부는 중요하지 않습니다. 그리고 사용자는 자신의 사용자 스타일 시트에서'* {font-size : 32pt! important}'를 항상 가질 수 있습니다. –

+0

나는 동의하지 않는다; 브라우저가 전체 페이지 vs가 다른 기본 글꼴 크기를 갖는지 여부는 내 시나리오에서 관련이 있습니다. 전자에서는 레이아웃이 유지되고 모든 것이 레이아웃에 맞습니다. 후자의 경우 특정 크기를 초과하여 텍스트가 더 이상 컨테이너에 제대로 들어 가지 않으며 바람직한 방식으로 줄 바꿈/겹침/잘림이 가능하지 않을 수 있습니다. 내가 염려하는 경우는 브라우저 글꼴 기본값이 22px 이상으로 설정된 사용자입니다. 나는 누군가가 사용자 스타일 시트를 통해 오버라이드 할 수 있지만 자신의 책임하에 그렇게 할 수 있음을 알고 있습니다. 내 요구 사항을 감안할 때 이것이 가능하지 않아야합니까? – Dan