Background image растянуть: Как растянуть фон на всю ширину окна?

Как растянуть изображение в фотошопе?

Редактирование картинок в фотошопе может потребовать изменения их масштабов. В частности – растяжения. Какими способами это можно сделать? Как растянуть изображение в фотошопе?

Рассмотрим способы решения данной задачи в Photoshop версии CS6 с англоязычным интерфейсом.

Содержание статьи

• Растяжение картинки, являющейся фоном
• Растяжение картинки, являющейся слоем
• Растяжение картинки на холсте с помощью группы опций Free Transform
• Растяжение картинки с помощью опции Transform Controls

Картинки, редактируемые с помощью фотошопа, могут быть представлены в формате:

• фонового слоя – Background;
• изображения (в виде самостоятельного слоя) – Layer.

В первом случае редактируемое изображение будет выглядеть так:

Реклама

Второй вариант предполагает следующее размещение картинки:

В данном случае изображение располагается непосредственно над холстом.

Картинка может размещаться и так – в виде слоя, полностью независимого от холста.

Картинка в виде отдельного слоя может быть размещена также и на фоне других рисунков. Каждое из изображений формирует при этом самостоятельный слой.

В каждом случае особенности «растяжения» рисунка – разные. Изучим их.

Растяжение картинки, являющейся фоном

Итак, первый вариант размещения картинки в структуре проекта фотошопа – в виде фона. Как правило, подобная схема расположения рисунка активируется программой, если выполнить открытие изображения, изначально не являющегося частью проекта. То есть если выбрать пункт меню File, затем – Open и загрузить ту или иную картинку, то она отобразится в качестве фона.

Фотошоп предусматривает фактически только один способ растянуть соответствующее изображение. Он предполагает задействование группы опций Image Size. Для того чтобы получить к ним доступ, нужно выбрать пункт меню Image, затем – Image Size.

После этого можно будет указать нужный размер рисунка – в пикселях, в процентах, сантиметрах и иных единицах измерения в абсолютном значении или же относительно исходной величины. Если в окне будет активирована галочка Constrain Proportions, то при увеличении или уменьшении параметра высоты изображения автоматически откорректируется значение для ширины – и наоборот.

Следующий способ редактирования рисунка в фотошопе – его размещение в проекте в качестве самостоятельного слоя. Данная картинка может совпадать по величине с фоновым слоем либо иметь меньший размер.

к содержанию ↑

Растяжение картинки, являющейся слоем

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

Стоит отметить, что при рассматриваемом варианте размещения изображения в структуре проекта можно использовать также и первый метод корректировки величины рисунка – через группу опций Image Size. Но это не всегда удобно. К тому же данная группа опций имеет не столь широкий функционал, как в случае задействования тех способов, которые мы сейчас рассмотрим.

Прежде всего, изучим то, как обеспечить размещение рисунка в проекте в виде слоя.

Первый «подвид» его соответствующего расположения – на холсте. Для того чтобы разместить изображение соответствующим образом, нужно загрузить его в программу, после – кликнуть 2 раза на названии слоя, который изначально является фоновым, а затем – нажать OK.

После этого слой переименуется из Background в Layer. Теперь рисунок может редактироваться отдельно от холста.

Можно свободно перемещать картинку по рабочей области проекта, используя инструмент Move Tool. Холст, в свою очередь, может быть залит цветом – с помощью инструмента Paint Bucket Tool.

Правда, задействование отмеченной опции окраски холста имеет особенность. Цвет, которым он заполняется, сливается в один слой с изображением, изначально открытым на холсте.

Это легко пронаблюдать, если вновь взять инструмент Move Tool и попытаться переместить редактируемую картинку – она начнет передвигаться вместе с окрашенным холстом.

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

Второй способ размещения картинки в проекте – в виде самостоятельного слоя, никак не связанного с холстом. На практике это возможно, если между таковым и редактируемым изображением размещен какой-либо другой рисунок.

Фактически работа должна вестись с 2 слоями – тем, который «объединен» с холстом, и тем, который является самостоятельным графическим элементом.

Способность свободно перемещаться по экрану картинки – в виде слоя, размещенного на холсте, либо в виде полностью независимого слоя – предопределяет возможность задействования следующих методов ее растяжения (не считая рассмотренного нами выше):

• использование группы опций Free Transform;
• задействование инструмента Transform Controls.

Изучим их особенности подробнее.

к содержанию ↑

Растяжение картинки на холсте с помощью группы опций Free Transform

Для наглядности предлагается увеличить холст – чтобы картинка имела меньшую, чем он, площадь, и ее можно было растягивать. Для этого нужно выбрать пункт меню Image, затем – Canvas Size. В открывшемся окне следует ввести значение величины холста, соответствующее примерно 120 %. При этом галочку напротив Relative желательно снять.

В результате на холсте появится достаточное пространство для растяжения изображения.

Далее нужно выбрать инструмент Rectangular Marquee Tool либо любой другой, что располагается в соответствующей группе. После – кликнуть правой кнопкой мыши на изображении и выбрать пункт Free Transform. Затем сразу же надо щелкнуть на картинке правой кнопкой еще раз – после этого откроется требуемая группа опций.

За растяжение картинки отвечают первые 6.

Опция Scale позволяет увеличить либо уменьшить размер изображения без изменения его геометрического типа. То есть если изначально картинка – прямоугольник, она им же и останется. Однако ее пропорции, величины ее сторон могут быть выражены практически в любых значениях.

Чтобы изменить размер картинки, нужно потянуть за ползунки, которые появляются сразу же после активации опции Scale. Если тянуть за угловые – меняется величина изображения в целом. При удержании клавиши Shift – пропорционально исходному размеру.

Если тянуть только за верхние и нижние ползунки – изменится высота рисунка, если за боковые – ширина.

Важный нюанс задействования любой из опций рассматриваемой группы: чтобы закрепить результат работы над редактируемой картинкой, нужно нажать Enter.

Следующая опция – Rotate. С ее помощью можно поворачивать картинку – в любую сторону.

Благодаря опции Skew можно менять взаимное расположение сторон рисунка либо корректировать размер одних сторон относительно других. Например – разместить правую сторону выше левой, нижнюю – левее или правее верхней. Или же правую сторону сделать короче, чем левую.

Отметим, что заметное растяжение рисунка при задействовании опции Skew осуществляется, только если активно потянуть за один из угловых ползунков.

Опция Distort в некотором смысле дополняет предыдущую – в ней как раз таки реализована возможность не только менять длину сторон картинки и взаимное их расположение, но также и растягивать изображение практически в любую сторону.

Опция Perspective в чем-то схожа с функцией Skew, однако решает более узкую задачу – создать перспективу для рисунка. Которая может выглядеть примерно так:

Как в фотошопе растянуть часть изображения? Решению данной задачи способна посодействовать, вероятно, самая примечательная опция рассматриваемой группы – Warp. С помощью нее можно растягивать отдельные участки рисунка.

Соответственно, непосредственно за растяжение (тем или иным способом) картинок отвечают такие опции, как:

• Scale;
• Skew;
• Distort;
• Perspective;
• Warp.

При необходимости растянутое изображение можно также повернуть, задействовав опцию Rotate.

Отметим, что изменять размер картинки – при использовании большинства инструментов, входящих в группу Free Transform, – получится не только с помощью ползунков. Дело в том, что сразу же после активации той или иной опции в верхней части интерфейса фотошопа открывается дополнительная панель настроек.

Используя ее, можно указывать точные значения единиц, определяющих размеры и пропорции картинок либо их сторон. Исключение – сложный инструмент Warp. Необходимая корректировка изображения при его применении осуществляется вручную.

к содержанию ↑

Растяжение картинки с помощью опции Transform Controls

Изучим теперь то, как растянуть изображение в Photoshop, задействуя другой инструмент – Transform Controls. Он считается, с одной стороны, менее функциональным, чем группа опций Free Transform, с другой – простым в использовании.

Активируется он очень просто. Нужно выбрать инструмент Move Tool, после – поставить галочку напротив открывшегося чуть ниже меню пункта Show Transform Controls.

В результате на картинке появятся ползунки – подобные тем, что активируются при задействовании опций Free Transform. Применяя их, можно:

• регулировать размер изображения в целом, размер его сторон;
• поворачивать картинку.

Как и в случае с инструментами Free Transform, при использовании опции Show Transform Controls в верхней части интерфейса фотошопа открывается дополнительная панель настроек точных значений размеров рисунка либо его элементов.
Рассматриваемый метод растяжения картинок особенно удобен при работе с несколькими изображениями – как раз в тех случаях, когда они являются полностью независимыми от холста слоями. Так, менять их размер с помощью опции Transform Controls становится возможным сразу же после щелчка по соответствующему слою мышкой – не нужно активировать каких-либо дополнительных функций фотошопа.

Закрепление результатов редактирования картинок осуществляется, как и при использовании предыдущего метода, с помощью клавиши Enter.

Как растянуть картинку в css

Растянуть фоновую картинку на всю ширину окна браузера с помощью CSS3.

Решение

Для масштабирования фона предназначено свойство background-size , в качестве его значения указывается 100%, тогда фон будет занимать всю ширину окна браузера. Для старых версий браузеров следует использовать специфические свойства с префиксами, как показано в примере 1.

Пример 1. Растягиваемый фон

HTML5 CSS 2.1 IE Cr Op Sa Fx

Результат данного примера показан на рис. 1.

Рис. 1. Вид фона при уменьшенном размере окна

При увеличении размера окна браузера фон также начнёт расширяться, это приведет к ухудшению вида картинки (рис. 2).

Доброго времени суток, гики сайтостроения и любители веб-тематики. Сегодня я хочу дать ответ на часто задаваемый вопрос не только новичками, но иногда и разработчиками: «Как растянуть картинку css на весь экран?» На самом деле такой прием очень просто реализовывается, но тут дело в другом.

На сегодняшний день существует множество способов и языков программирования, благодаря которым изображение может размещаться на целый экран. Поэтому в данной публикации я расскажу о нескольких способах создания полноразмерного фонового изображения при помощи css, css3, jquery и php. Приступим к делу!

Способ 1.

Адаптивная фоновая картинка css-средствами

Для того чтобы сделать фоновое изображение адаптивным, в каскадных стилевых таблицах предусмотрено свойство background- size. Оно позволяет установить размер графического файла по отношению к размерности открытой вкладки браузера.

Для этого нужно всего лишь написат вот такую строку:

background- size: 100% auto

Первый параметр, т.е. 100%, отвечает за растягивание картинки по горизонтали, второй параметр – по вертикали. Теперь перейдем к примеру.

Такой способ поддерживают браузеры, начиная с 10 версии Opera, 3 версии Safari, Firefox 3.6 и 9 версии IE.

Способ 2. Резиновый фон при помощи css3

С выходом в мир спецификации css3 в язык добавилось много удобных инструментов. Так, для создания растянутого фона в виде изображения используется то же свойство, что и в предыдущей главе, однако размер изображения задается не процентами, а специальным словом cover: background- size: cover. Очень удобно, не правда ли?

Чтобы посмотреть, как работает данное свойство, запустите прошлый пример, изменив в параметры background-size 100% и auto на cover.

Что касается браузеров, то такой способ поддерживают все современные версии.

Для тех, кто хочет разобрать вариант с css подробнее, я рекомендую найти статью на моем блоге о резиновом фоне, где я подробно и с примерами описал данные методы.

Способ 3. jQuery и его инструменты создания адаптивного фона

Для начала хочу сказать, что jQuery – это библиотека другого языка – JavaScript – которая упрощает функционирования последнего с html.

Сам по себе jQuery очень удобен. С ним проще работать с API, легче получать доступ к различным элементам кода, а также проще реализовывать некоторые вещи.

Для того чтобы в примере заработал данный способ, нужно вначале подключить скрипт js вот такой строкой:

<script type=»text/javascript» src=»https://ajax. googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js»></script>

Ниже я прикрепил программный код примера с уже вставленной в него реализацией jQuery.

Этот способ является универсальным и поддерживается многими браузерами даже тогда, когда css-инструменты не работают.

Способ 4. Php-реализация растянутого на весь экран изображения

Несколько слов о самом языке. Php принято называть языком сценариев. С его помощью пишут серверную часть веб-приложений, т.е. связывают сервис с базой данных, обрабатывают запросы и т.д. Сам код php внедряется в html и гибко взаимодействует с ним.

Чтобы вставить кусок кода, нужно прописать текст в вот таких скобках:

А теперь в первоначальный пример вам нужно вставить всего лишь несколько строк:

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

В этот момент, например, решение на языке php применится к рисунку только после отработки функции на сервере.

На этой ноте я заканчиваю статью. Не забывайте подписываться на мой обучающий блог и делиться ссылкой на публикации с друзьями. Пока-пока!

Мы можем растянуть background на чистом css, благодаря свойству background-size которое присутствует в CSS3. Мы будем использовать html элемент, это лучше чем body, так как он всегда будет равен высоте окна браузера. Мы сделаем background фиксированным и поставим его в центре окна, после этого мы его растянем на весь экран с помощью свойства background-size.

Кроссбраузерность:

Opera 10+ (Opera 9.5 поддерживает background-size но не поддерживает ключевых слов)

Также есть вариант решения для IE, только необходимо тестировать. Некоторые вебмастера говорят, что могут возникнуть проблемы из ссылками и скроллингом.

Растянуть background на чистом CSS

Сделать background на весь экран с помощью чистого CSS кода, можно двумя методами. Не исключение что существуют и другие.

1 – Метод

Здесь мы будем использовать элемент img, который будет растянут на все окно, и будет выглядеть одинаково во всех браузерах. Мы установим min-height, который будет заполнять окно браузера по вертикали. Также установим width на 100%, который будет заполнять окно по горизонтали. Мы также установим min-width картинки, таким образом, фон никогда не будет меньше, нежели мы установим.

Особо хитрая часть кода, это использование медиа запроса, для предотвращения бага, когда окно браузера будет меньше, нежели картинка фона. А также, комбинированное использование отступа с процентным left. Это позволяет держать background в центре, несмотря ни на что.

Кроссбраузерность:

Любые версии популярных браузеров: Safari / Chrome / Opera / Firefox

IE 6: По крайней мере background остается фиксированным

IE 7/8: Множество работ не центрируются на малых размерах, но заполняет экран лучшим образом

2 – Метод

Еще один простой способ реализовать это, вставить картинку на страницу. Она будет иметь фиксированную позицию и будет размещена в верхнем левом углу. Мы присвоим ей min-width и min-height 100%. Также нужно заранее подготовить картинку, в плане пропорциональности сторон.

Хотя, этот код не центрирует background image. Поэтому, сейчас мы это исправим… Мы можем фиксировать картинку с помощью взятия ее в div.

Кроссбраузерность:

Safari / Chrome / Firefox (не тестировалось на более древних версиях)

Opera (любые версии) и IE отображают одинаково (плохо позиционируют, не пойму почему)

Растянуть background с помощью jQuery

Эта идея появилась немного ранее (как альтернатива CSS методу). Если мы будем знать пропорции и размер картинки, мы сможем растянуть background на CSS. Если картинка меньше окна браузера, мы изменим width на 100% для картинки. Если больше, мы можем установить только height 100% и знать, что картинка заполнит все как по ширине, так и по высоте.

Мы можем получить доступ к нужным данным с помощью JavaScript. Как и все, я использую фреймверк jQuery.

Здесь не реализовано центрирование, но вы с легкостью можете сделать это.

Кроссбраузерность:

И все другие популярные браузеры

Растягиваем background с помощью PHP

Собственно, PHP мы можем использовать для одной цели: обработки изображения с помощью GD библиотеки. Ранее я рассказывал о том, как сделать скрипт превью картинок. В этом случае его можно использовать для изменения размера изображения на лету. Но возникает проблема, изображение будет генерироваться при каждом обращении к сайту. Для большого проекта это слишком ресурсоемко. Лучше будет сделать готовые заготовки изображений, соответственно самым популярным разрешениям экранов (1024 x 1280, 1280 x 800…), используя фотошоп это не сложно. В случае, если разрешение экрана будет другим, это единичные случаи, мы подключим скрипт автоматического изменения размера. Он подключается следующим образом:

Привет. Сегодня рассмотрим, как можно растянуть фон css средствами (без вмешательства других средств, таких как javascript и иже с ними).

Растянуть фон CSS средствами стало возможно с появлением CSS3, конкретно при помощи свойства background-size. Надо сказать, что это свойство работает намного лучше, чем аналогичные решения на Javascript (которые использовались до появления background-size), так как быстрее и адекватнее реагирует на изменение размера браузера, быстрее сглаживает растянутую картинку, и, как любили говорить в начале 2000-х, — «Будет работать даже с отключенным Javascript».

Решение: как растянуть фон CSS средствами

У свойства background-size может быть несколько значений.
1) это может быть одна из дирректив: cover или contain.

2) это могут быть проценты (100% или 94% от ширины контейнера). При этом можно использовать как 1 значение в процентах, так и 2. Если значений будет 2, то масштабироваться будут одновременно и высота и ширина картинки, при этом каждая из величин подгоняется пропорционально процентами указанными в параметрах).

3) прямо численное значение (в пискелях, сантиметрах, em и т. д.). Параметров также может быть 2 (или 1), как и в предыдущем случае.
4) значение auto. Обозначает, что картинка не будет растягиваться, а будет использован исходный размер. При этом, параметров также может быть 2 или 1. То есть можно указать следующее:

Где будет работать решение растянуть фон CSS?

Судя по данным сайта Can I Use, работать будет во всех современных браузерах, включа IE версии не ниже 9. Так, что переживать в принципе повода нет. Смотрите таблицу совместимости:

Как растянуть фон в GIMP | Малый бизнес

Дэвид Видмарк

GIMP, бесплатная программа Gnu Image Manipulation, является отличным ресурсом для любого малого бизнеса с ограниченным бюджетом, которому требуется профессионально выглядящая графика. Если у вас есть изображение, которое вы хотите использовать в качестве фона для своей работы, растянуть его до нужного размера — это простой двухэтапный процесс. Первый шаг — указать, какой размер должно занимать изображение, а второй шаг — просто масштабировать изображение до этого размера.

Изменение размера холста

1. Запустите GIMP и откройте изображение, которое вы хотите использовать в качестве фона в вашем проекте, выбрав «Открыть» в меню «Файл». Для достижения наилучших результатов выберите изображение с высоким разрешением, близкое к тому размеру, который вам нужен. Слишком сильное растяжение небольшого изображения с низким разрешением может привести к пикселизации, в результате чего изображение будет выглядеть зернистым.

2. Выберите «Размер холста» в меню «Изображение». Откроется панель «Задать размер холста изображения».

3. Щелкните значок «Цепь» рядом с шириной и высотой, чтобы разблокировать пропорции высоты и ширины. Когда звено в цепи разорвано, пропорции не скованы. Если вы измените высоту или ширину, когда ссылка не повреждена, другой размер автоматически подстроится, чтобы сохранить те же пропорции.

4. Щелкните меню «Пиксели», чтобы изменить единицу измерения на «Дюймы» или любую другую общепринятую единицу измерения.

5. Введите нужные значения в текстовые поля «Ширина» и «Высота», затем нажмите кнопку «Изменить размер». Размер холста автоматически изменяется, и изображение теперь находится в верхнем левом углу холста.

Растягивание изображения

1. Выберите инструмент «Масштаб» на панели инструментов. Этот значок представляет собой квадрат со стрелкой, указывающей вниз из одного угла.

2. Щелкните изображение. Откроется панель «Масштаб», и вдоль границы изображения появятся восемь квадратных маркеров.

3. Щелкните значок «Цепь» на панели «Масштаб», если вы хотите ограничить пропорции. Ограничиваете ли вы пропорции изображения или нет, зависит от того, насколько сильно вам нужно растянуться и что изображено на изображении. Даже человеческое лицо часто можно растянуть на пять процентов без искажения.

4. Перетащите правый нижний угол изображения в правый нижний угол холста, чтобы заполнить холст изображением. Либо перетащите правый или нижний «манипулятор» на краю изображения. Вы также можете указать точные пропорции изображения в текстовых полях «Ширина» и «Высота» на панели «Масштаб».

5. Нажмите «Ввод» на клавиатуре, чтобы принять изменения, внесенные в изображение.

6. При необходимости переместите изображение, выбрав инструмент «Переместить» и перетащив изображение на место. В этом нет необходимости, если вы не заблокировали пропорции при изменении размера изображения.

7. Сохраните изображение под новым именем, выбрав «Сохранить как» в меню «Файл». Это не позволит вам писать поверх оригинала.

Список литературы

• GIMP: Canvas Size
• GIMP: Scale Image

Ресурсы

• GIMP: Загрузки

Писатель Bio

A Professional Pulater Pulater и Professional Proveriefers Pulater и Professional Hoperments Weedmarmsments Weedmarms. технологий, средств массовой информации и маркетинга более 20 лет. Он преподавал информатику в Алгонкинском колледже, основал три успешных предприятия и написал сотни статей для газет и журналов Канады и США.

Всегда растягивать фоновое изображение тела до полного покрытия — Общее — Форум

loewenkunst (Мириам) 13 ноября 2020 г., 13:10

1

Привет всем,

У меня есть фоновое изображение тела, которое я хочу растянуть сверху вниз и слева направо. Изображение представляет собой цветовой градиент, но особый, который нельзя создать с помощью встроенной функции градиента в Webflow. Его можно сжимать и растягивать, мне все равно — я просто хочу, чтобы он всегда был полностью виден. Теперь Webflow кажется слишком хорошим и всегда пытается сохранить идеальное соотношение сторон изображения, и я не вижу, как это изменить.

Я думал, что это должно работать, если установить «Обложку», но внизу всегда остается немного места. Самое близкое, что я получил до сих пор, это установить его на «Пользовательский» с шириной и высотой, установленными на авто. Но при переключении на мобильный вид он не «сжимается» и части изображения не пропадают.

Ссылкой поделиться не могу так как проект еще не официальный — надеюсь мои пояснения достаточно понятны.

Кто-нибудь знает, как настроить изображение так, как я хочу, не обращая внимания на соотношение сторон?

Спасибо

Стэн (просто другой разработчик) 13 ноября 2020 г., 18:40

2

Привет, @loewenkunst, нет причин не делиться общедоступной ссылкой. Но если у вас есть конкретные причины, просто создайте копию и удалите все, кроме проблемной части.

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

левенкунст (Мириам) 17 ноября 2020 г., 7:43

3

Привет, Стэн, я думаю, что дал довольно вескую причину не делиться этим в своем посте, не так ли? Это проект для компании, которая еще не запущена, поэтому он не может быть онлайн или каким-либо образом распространяться. Но я также думаю, что мой вопрос довольно прямолинеен: как я могу установить фоновое изображение так, чтобы оно полностью заполнило своего родителя, не обращая внимания на исходное соотношение сторон?

Стэн (просто другой разработчик)

17 ноября 2020 г. , 8:52

4

Никаких проблем, вы ясно даете понять.

университет.webflow.com

Адаптивные изображения в Webflow | Университет Вебфлоу

Адаптивные изображения — это функция по умолчанию, автоматически включенная в Webflow.

webflow.com

Подставка для объекта | Функции веб-потока

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

Удачи

1 Нравится

(iDatus) 17 ноября 2020 г., 9:39

5

Мириам, хороший вопрос для тех, кто читает это настройки для фона

Я немного поиграл, и вы правы, он сохраняет форму объекта.
Это не похоже на атрибут заполнения элемента изображения.
Я предполагаю, что это сделано с помощью html, чтобы уменьшить нагрузку на процессор.
Теперь вы можете попробовать использовать изображение и позиционирование.

1 Нравится

(Мириам) 20 ноября 2020 г., 9:40

6

Эй, iDATUS, спасибо, что воссоздали мою проблему! То есть вы имеете в виду, что вместо использования функции фонового изображения я добавляю его как обычное изображение?

ИДАТУС (iDatus) 20 ноября 2020 г., 10:35

7

Только что попробовал, и вот предложение

Скриншот 20. 11.2020 1033401332×819 200 КБ

Скриншот 20.11.2020 1034251302×713 903 КБ 1 Нравится

(Мириам) 29 января 2021 г., 16:54

8

Эй, iDATUS, спасибо за помощь. Я думаю, что наконец нашел решение, которое работает для меня. Я сделал, как вы предложили, и поместил все в обтекание страницы, но затем я поместил изображение не как элемент, а как фоновое изображение обтекания страницы с опцией «обложка», и это отлично работает. Я думаю, что проблема с телом заключается в том, что он, кажется, учитывает только область просмотра, поэтому, если высота фона установлена ​​​​на 100%, это 100vh. Обычный div не делает этого, как кажется.

ИДАТУС (iDatus) 30 января 2021 г.