Когда я создавал свой первый веб-сайт, полностью посвященный html / css, я использовал интерактивные изображения в качестве меню, и каждое изображение и div масштабировались в%, поэтому они очень хорошо адаптировались ко всем мониторам и браузерам, и это так.

Теперь в новом проекте я хотел сделать меню веб-сайта, используя фоновое изображение для всей страницы (с кнопками меню на нем, но без текста), а затем гиперссылку текста поверх изображения, чтобы оно выглядело как правильное меню.

Так что я, хотя, хорошо, если я просто поставлю размер шрифта в%, он, вероятно, будет идеально масштабироваться, поскольку размер отображаемой части окна браузера увеличивается или уменьшается, он отлично работал со всем остальным, так почему бы ему не работать сейчас ...

Я сделал это, и это не работает, я не знаю, где, черт возьми, эта штука получает проценты, если я установил 100% размер шрифта в div, который имеет 2% или 3% размера страницы, текст в зависимости от разрешения будет слишком большим или слишком маленьким.

Я знаю, как сделать масштабируемые объекты в соответствии с окном браузера, но как сделать масштабируемым размер текста в соответствии с этим или в самом окне браузера?

Ответ, рассказывающий, как это сделать, используя только css и html, это лучше для меня, я немного знаю сценарии, но мне не нравится смешивать часть отображения с частью сценария, поэтому, если вы кто-нибудь знает, как это сделать, используя только html / css Я буду продолжать использовать интерактивные изображения и проценты или пиксели для всего этого.

Благодарю вас.

2
wxiiir 30 Авг 2011 в 23:15

2 ответа

Лучший ответ

Другое решение этой проблемы - использовать гибкую / адаптивную структуру CSS, а затем использовать медиа-запросы для настройки размера шрифта в зависимости от ширины браузера, чтобы он выглядел отлично при любой возможной ширине. .

Вот несколько примеров:

Сетка 1140 (http://cssgrid.net/)

Скелет (http://www.getskeleton.com/)

Или тот, с которым я сейчас работаю (https://github.com/gogogarrett/Muscle)

Надеюсь это поможет.

1
GoGoGarrett 30 Авг 2011 в 19:29

font-size так не работает.

font-size - это размер относительно размера шрифта его родительского элемента.

В CSS вы не можете изменять размер шрифтов в соответствии с шириной окна. Однако это можно вычислить в Javascript.

2
Community 23 Май 2017 в 09:59