Форум программистов, компьютерный форум, киберфорум
Наши страницы
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
kol
24 / 10 / 5
Регистрация: 30.01.2015
Сообщений: 175
1

Масштабирование

27.02.2016, 13:18. Просмотров 402. Ответов 4
Метки нет (Все метки)

В общем ломаю голову не могу понять как сделать. Что бы изображение растягивалось полность на всю страницу.
HTML5
1
2
3
<div style="">
    <img src="img/photo-1.jpg" style="">
</div>
А если например понадобиться на страницу отобразить это же изображение, но меньшего размера, например в див блоке, то как задать размеры изображения что бы избежать искажения? Ведь если задать фиксировано, то искажение будет на лицо и это будет не красиво
0
QA
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
27.02.2016, 13:18
Ответы с готовыми решениями:

масштабирование
Здоровья Вам!!! прошу помощи! вот делаю такую карту http://namore.biz.ua/karta в Мазиле...

масштабирование!
привет! скажите, почему при масштабировании страницы (ctrl+scroll) на одних страницах происходит...

Масштабирование
Пишу сайт на юкозе....столкнулся с такой проблемой....шаблон притянут к краям страницы и при...

Масштабирование кнопок
Добрый день! Есть очень простенькая заготовка сайта. Состоит из фона и 3 кнопок. Кнопки...

Масштабирование iframe
Здравствуйте. Я использую такой css-код -webkit-transform: scale(0.75);...

4
Krauzer
6 / 6 / 3
Регистрация: 05.02.2013
Сообщений: 19
27.02.2016, 13:59 2
http://plnkr.co/edit/nVRsXjtiqHkIbmdFxIyi?p=preview
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE html>
<html>
 
  <head>
    <link rel="stylesheet" href="style.css">
  </head>
 
  <body>
    <div id="wrapper"></div>
  </body>
 
</html>
0
bobrzzz
6 / 6 / 2
Регистрация: 05.08.2015
Сообщений: 42
27.02.2016, 14:16 3
они растягивают по высоте на 100%, а потом центрируют, все что не влазит в контейнер скрывается:
HTML5
1
<div style="text-align: center; overflow: hidden><img src="blbbla" style="width: auto; height: 100%"></div>
по ссылке там конечно гораздо более сложная реализация, но принцип такой
0
kol
24 / 10 / 5
Регистрация: 30.01.2015
Сообщений: 175
27.02.2016, 14:42  [ТС] 4
bobrzzz, Мне вот как раз интересно как сделано по ссылке...
0
bobrzzz
6 / 6 / 2
Регистрация: 05.08.2015
Сообщений: 42
27.02.2016, 14:50 5
ну если конкретно по ссылке, то Krauzer, сделал почти именно то что надо, только без вот этого:
CSS
1
2
3
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
там они картинку грузят как фон к диву(растянутый на 100% по высоте и ширине), и потом центрируют задний фон в цсс, просто выше я отвечал предполагая что вам интересен способ реализации с указанными тегами, а не то как это сделано по ссылке конкретно
0
27.02.2016, 14:50
Answers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
27.02.2016, 14:50

Масштабирование изображения
Здравствуйте Можно ли масштабировать картину так, чтобы картина на экране имела размер, равный...

Масштабирование спрайтов
Подскажите, как можно масштабировать спрайты?

Масштабирование в css
Добрый день. Нужна помощь. Реально ли средствами css сделать следующее: На сайте хедер, под...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2020, vBulletin Solutions, Inc.