Другие языки программирования и технологии

как на сайте сделать изображение на весь экран? Реально на весь экран (любого монитора)?

1). на хтмл странице в body только один тэг

однако с краев остается белая полоса. как ее убрать?

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

Каковы должны быть параметры файла-картинки (разрешение и размеры) , чтобы на большинстве современных мониторов смотрелось ок?

2.1. (Разрешение) Как я понимаю, разрешение в файлах для инета надо ставить 72 dpi, потом делать Save for Web в Фотошопе. .

Но если у меня исходная картинка 800х600 300dpi - может не менять разрешение, чтобы не ухудшилось, когда браузер растянет на мониторе 1280х1024?

2.2. (Размеры) К какому размеру лучше приводить картинку в фотошопе? Чтобы лучше смотрелась на большинстве мониторов?

800х600, 1024х768, ..
Ведь бывают мониторы и 1366х768

Буду благодарен за подсказку, как рассуждать или что и где почитать.. .

Спасибо откликнувшимся!!!
NM
Nazir Muminov
5
1) Сброс стилей по умолчанию спасет. В CSS:
* { padding:0; margin:0; }
В данном случае, если "один тег" - это div, то достаточно сбросить отступы для body

2) Растянуть фоновое изображение можно при помощи CSS - не работает в старых браузерах, включая IE8
background-size
Как сделать кроссбраузерно на CSS: http://alex.ermilov​.net/html/css3/background-size/
Способы для img - http://css-tricks​.com/perfect-full-page-background-image/

2.1) - Качество ухудшаться будет при любом изменении размеров (масштабировании) . Против этого есть только одно средство - векторная графика. Но кроссбраузерная реализация сложновата (библиотеки нужно знать) и не всегда приемлема по объему инфы.

2.2) - Мониторы не только разных размеров (вернее, тут речь о разрешении) бывают, но и разных пропорций. Так что делать под любой размер - бессмысленно. Большинство - 16:9 по пропорциям. Среднее разрешение - около 1440 по ширине. http://gs.statcounter.com/#resolution-ww-monthly-201112-201212

Многие JS слайдеры и галереи умеют растягивать картинку на экран начиная с Lightbox и клонов типа Fancybox, и заканчивая слайдерами http://www.freshdesignweb.com/15-fullscreen-background-jquery-image-slider-and-slideshow.html
Дмитрий Красовский
Дмитрий Красовский
60 970
Лучший ответ
Если поставить любую картинку как фон то она будет отображаться в масштабе 1:1 и с этим не чего не поделать.
Можно выбрать картинку не большого размера которая при теражировании не будет выглядить уродски.
Можно выбрать картинку большого размера и поставить факсированое позиционировани. Тогда при прокрутке страници в низ она будет остоваться на месте.
NM
Nursult@n Moldoshev
60 380

Похожие вопросы