Адаптация фонового изображения

@Konark · Регистрация: 20.01.2012

Студворк — интернет-сервис помощи студентам

При адаптации под движок, нужно будет разрезать фон для того, чтобы он был более адаптивный? (Больше статей, больше блоков в сайдбаре)
Код в теме: Зафиксировать фоновое изображение

Комментарий модератора

Один вопрос - одна отдельная тема!

@sad67man · 02.01.2017, 22:16

Konark, Я кажется понял. У вас .wrapper неверно реализован, это нужно делать не картинкой, а тенями тут можете посмотреть примеры
Соответственно, не надо фиксировать этот блок по высоте.

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

@Konark · 02.01.2017, 22:24 **[ТС]**

Спасибо! Шикарно выглядит с помощью этих стилей. Сделал что-то подобное, как на макете.
Только без height он не хочет работать...

А фон сайта сделал так (на будущее):

CSS
1
2
3
4
5
html {
    background: url("../img/top-background.jpg") no-repeat center top,
    url("../img/footer-background.jpg") no-repeat center bottom,
    url("../img/middle-bg.jpg") repeat center 600px;
}

@sad67man · 02.01.2017, 22:33

Konark, Добавьте

CSS
1
2
3
4
5
.wrapper::after{
    content: '';
    display: block;
    clear:both;
}

Либо перед закрывающимся тегом .wrapper добавьте див

HTML5
1
<div class='clearfix'></div>

CSS
1
.clearfix{clear:box}

@Konark · 02.01.2017, 22:56 **[ТС]**

Сообщение от sad67man

Konark, Добавьте

Странно, но не то, не то не сработало. Я так понял, это очистка потоков? Обычно я делаю через overflow: hidden

Вот последняя версия проекта

@sad67man · 02.01.2017, 23:12

Konark, У меня все сработало

@Konark · 02.01.2017, 23:19 **[ТС]**

Сообщение от sad67man

Konark, У меня все сработало

Странно, все так как и я делал. Сделал еще раз - сработало. Возможно кэш всему вина.

Спасибо, огромное за помощь !)
Вот бы знать все нюансы css. А то, как узнать про то что тени уже можно делать с помощью чистого CSS? Или что здесь нужно очистить поток, а не проблема в чем-то другом?

@sad67man · 03.01.2017, 00:39

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

Добавлено через 1 час 2 минуты
Konark, Я просто описался в своем комментарии, написал clear:box, а надо clear:both. Моя невнимательность)

Новые блоги и статьи Все статьи Все блоги /
Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK сделайте это, JDK, то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Перейдите по ссылке:. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .	моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом
http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .	Расчёт переходных процессов в цепи постоянного тока igorrr37 16.01.2026 / * Дана цепь(не выше 3-го порядка) постоянного тока с элементами R, L, C, k(ключ), U, E, J. Программа находит переходные токи и напряжения на элементах схемы классическим методом(1 и 2 з-ны. . .	Восстановить юзерскрипты Greasemonkey из бэкапа браузера damix 15.01.2026 Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .

@sad67man 2603 / 1507 / 689 Регистрация: 23.08.2015 Сообщений: 3,823
	02.01.2017, 22:16
	Konark, Я кажется понял. У вас .wrapper неверно реализован, это нужно делать не картинкой, а тенями тут можете посмотреть примеры Соответственно, не надо фиксировать этот блок по высоте. Добавлено через 8 минут Konark, Либо действительно разрезать изображение. В любом случае блок не должен быть фиксированным по высоте, чтоб контент мог его растягивать. 0

@sad67man 2603 / 1507 / 689 Регистрация: 23.08.2015 Сообщений: 3,823
	03.01.2017, 00:39
	Konark, Ну есть же всякие видео курсы по css3, и книги можно почитать. Технологии нужно знать. Добавлено через 1 час 2 минуты Konark, Я просто описался в своем комментарии, написал clear:box, а надо clear:both. Моя невнимательность) 0

Адаптация фонового изображения

Решение