Простота CSS заключается в легкости его изучения; сложность CSS заключается в поиске лучших решений. Кажется, в мире CSS не существует такого понятия, как совершенство. Поэтому представленный сейчас CSS — это абсолютное дно, и это просто самое идеальное решение среди решений, которые я видел до сих пор.
Давайте сначала поговорим о том, почему мы используем это решение для нижнего макета CSS:
При оформлении страницы, если содержимое страницы очень маленькое и его недостаточно для заполнения площади окна одного экрана, то по обычному макету оно будет выглядеть как на картинке ниже (то есть нижний контент не расположен в нижней части окна, но оставляет много пустого места.
Это неприглядно для дизайнера, ищущего несовершенства. В интернете есть решения, но при изменении высоты окна нижняя часть и основной текст перекрываются БАГ. Хотя не многие люди захотят изменить высоту окна, дизайн – это совершенство.
Вот найденный мною относительно идеальный метод, который может быть реализован зарубежным экспертом по дизайну с использованием чистого CSS: когда текстовое содержимое небольшое, нижняя часть окна находится внизу. При изменении высоты окна не будет проблем с перекрытием.
Даже человек, создавший этот CSS, создал веб-сайт, чтобы представить это решение для нижнего макета CSS. Не знаю, подавал ли он заявку на патент :)
HTML-код:
Примечание. Обязательным условием для использования этого макета является то, что нижний колонтитул должен находиться за пределами общего контейнера div. Нижний колонтитул использует слой, а все остальное содержимое использует общий слой. Если вам действительно нужно добавить другие родственные слои, то этот родственный слой должен использовать положение: абсолютное для абсолютного позиционирования.