HTML/CSS контентное масштабирование
Я начал разрабатывать веб-страницу, просто поиграть, и я заметил проблему. Я кодирую своим живым сайтом на одной половине экрана, а мой редактор - на другой. Все шло хорошо, пока я полностью не расширил свой веб-браузер и не заметил, что только часть моего сайта изменила размеры, как я этого хотел. К сожалению, мой сайт не работает, но у меня есть ссылка на код: http://pastebin.com/yeWzfsBW
Теоретически, изображение (логотип) не уменьшается при изменении размера окна, оно остается неизменным, несмотря ни на что. Я попытался использовать проценты вместо ширины / высоты пикселя, но, похоже, это не имело никакого эффекта. Я постараюсь показать это вживую, чтобы вы могли понять, что именно я имею в виду.
Полноразмерный браузер: http://imageshack.us/photo/my-images/585/fullsizen.jpg/
оконный режим: imageshack.us/photo/my-images/42/resizedkl.jpg/ (пожалуйста, укажите http: // я не могу связать более двух ссылок в этом посте)
Надеюсь, вы поймете, что я имею в виду, я бы хотел, чтобы логотип масштабировался, например, в разделе #info css.
Спасибо!
1 ответ
Не нужно оборачивать изображение в div. установить ширину и высоту в CSS. установить максимальную ширину и максимальную высоту. Существует проблема с сохранением соотношения сторон на изображении. Чтобы начать, ниже приведен пример использования вашего кода. посмотрев на это, вы можете оставить отзыв о том, чего именно вы пытаетесь достичь. http://codepen.io/seraphzz/pen/thGkI