в MailerLite Требования к размеру изображения
в MailerLite — MailerLiteПоиск
Ничего не найдено…
В этой статье
Требования к размеру изображения для кампаний Требования к размеру изображения для сайтов Требования к размеру изображения для форм
Требования к размеру изображения для кампаний Требования к размеру изображения для целевых страниц и веб-сайтов Требования к размеру изображения для форм
Остались вопросы?
Если у вас есть какие-либо вопросы, не стесняйтесь обращаться к нам.
Член нашей службы поддержки с радостью поможет вам.
Не знаете, какую версию MailerLite вы используете? Нажмите здесь, чтобы узнать!
При загрузке изображений в диспетчер файлов вы обнаружите, что ограничение размера файла для всех изображений составляет 2 МБ. Если размер вашего изображения превышает 2 МБ, вы можете сжать его во внешнем приложении или воспользоваться бесплатным онлайн-инструментом.
Требования к размеру изображения для кампаний
Использование изображений в ваших кампаниях может быть исключительно эффективным инструментом, чтобы привлечь внимание ваших читателей и заставить ваших клиентов действовать; и для того, чтобы оптимизировать вашу кампанию, вы должны оптимизировать размер изображения.
Максимальные размеры блоков изображений в ваших кампаниях составляют 640 пикселей в ширину. Некоторые блоки контента, содержащие изображения, имеют меньшие максимальные размеры.
| Максимальная ширина | Блок(и) контента |
| 560 пикселей | Блок логотипа; Главное изображение с блоком статьи |
| 270 пикселей | Логотип + основная надпись |
| 267 пикселей | 2 блока статей; Горизонтальное изображение + текстовый блок |
| 140 пикселей | Блок из 4 статей |
Вы можете вставить любое изображение шириной до 1280 пикселей, тогда система автоматически уменьшит его до максимального размера.
Вы также можете сами изменить размер изображений в редакторе кампаний.
Примечание: Мы рекомендуем использовать в ваших кампаниях изображения размером не более 1 МБ. Изображения увеличивают размер вашего информационного бюллетеня, и если ваш информационный бюллетень станет слишком большим, более вероятно, что электронное письмо будет обрезано или попадет в папку со спамом.
Требования к размеру изображения для сайтов
Максимальный размер изображений на ваших целевых страницах и веб-сайтах составляет 1110 пикселей в ширину.
Размер некоторых блоков контента, содержащих изображения, будет автоматически изменяться в соответствии с максимальными размерами этого блока.
| Максимальная ширина | Блок(и) контента |
| 660 пикселей | 1 столбец блока контента |
| 330 пикселей | 2 столбца блока контента |
| 240 пикселей | 3 столбца блока контента; Блок формы регистрации |
Требования к размеру изображения для форм
Максимальная ширина изображений в ваших формах:
настроить ширину и высоту фонового изображения css
Если вы хотите разместить любое изображение на заднем плане, это довольно просто.
Если вы хотите сфокусироваться на какой-то точке изображения, которая немного усложняет код CSS. Если вы хотите манипулировать размером, это более сложно. Учитывая, что ни одно изображение не может соответствовать всем размерам экрана.
Рассмотрим случай изменения размера фонового изображения в теле (во весь экран) и внутри контейнера.
Чтобы понять размеры, мы всегда будем брать положение изображения в качестве центра. Это можно изменить в зависимости от изображения.
Установка размера фона в полноэкранном окне.
Мы сделаем тело 100%, чтобы мы могли использовать изображение. Вот как выглядит базовый HTML:
<голова> <тело>
Часть стиля будет содержать HTML и основной текст, а также фоновое изображение с центральным положением и без повторов:
HTML, тело {
высота: 100%;
маржа: 0;
заполнение: 0;
}
тело{
фон: url(earhy-lady.jpg) центр без повторов;
} Это просто выведет изображение в теле.
Не очень убедительно, верно?
Пример редактирования
Это связано с тем, что фоновое изображение имеет масштаб по умолчанию. Мы можем захотеть изменить его размер, чтобы он выглядел хорошо, по крайней мере, на рабочем столе. Вот как это выглядит после использования размера фона.
/* Изображение будет увеличено до полной ширины */
тело{
размер фона: обложка;
}
Редактировать пример
Мы можем подогнать его под высоту, изменив код следующим образом:
/* Это изменит размер изображения до полной высоты */
тело{
размер фона: содержит;
} Пример редактирования
Использование полноразмерных или полноразмерных изображений не является идеальным. Это идеально подходит для фоновых изображений, где можно обрезать изображение в некоторых точках.
Мы можем установить свойство background-position в то место, где мы хотим установить фокус при изменении размера области просмотра.
Фиксированный размер фонового изображения и размер в процентах:
Размер фона может иметь фиксированный или процентный размер.
Мы просто попробуем управлять шириной фона, чтобы продемонстрировать, как это работает. Это нарушит соотношение сторон.
/* Это изменит размер изображения на 400 пикселей по оси x и на 200 пикселей по оси y */
тело{
размер фона: 400 пикселей 200 пикселей;
} Пример редактирования
Это можно сделать как по оси X, так и по оси Y.
/* Это изменит размер изображения на 400 пикселей по оси Y и на 200 пикселей по оси X */
тело{
размер фона: 200 пикселей 400 пикселей;
} Пример редактирования
Что, если мы хотим изменить размер фонового изображения внутри контейнера?
Все методы, которые применимы к телу, глобально применимы для любого элемента, например набора логотипов. Возможно, нам придется использовать размер в процентах, чтобы изображения, такие как логотипы, не обрезались из-за размера фона.
Основное правило изменения размера изображения выглядит так:
/* Настройка базовой сетки */
.logo-контейнер {
дисплей: сетка;
сетка-столбец-шаблон: 1fr 1fr;
зазор сетки: 10px;
}
.лого{
размер фона: авто 70%;
} Этот размер подойдет, учитывая, что большинство логотипов имеют прямоугольное соотношение. Лужи с портретным размером будут обрезаны из-за размера в направлении x.
Пример редактирования
Для большего количества портретных изображений нам просто нужно использовать лучший размер фона. Высота будет больше 70%, чтобы в поле было полное изображение.
.лого{
размер фона: 70% авто;
} Это приведет к следующему результату.
Пример редактирования
Фото Саджада Нори, Омида Армина на Unsplash
https://unsplash.com/photos/_8rh7LPA4mE
Подойдут ли эти размеры для адаптивных макетов?
ответ зависит. Если оно содержится в каком-то контейнере, сохраняющем соотношение сторон, изображение будет хорошо выглядеть на всех устройствах.