• Страница 1 из 1
  • 1
Форум » Веб-разработка » Скрипты сайтов HTML » Установить картинку в нужном углу сайта на CSS (Как правильно выставить картинку в правом нижнем углу сайта)
Установить картинку в нужном углу сайта на CSS
Kosten
Дата: Среда, 29.08.2018, 00:44 | Сообщение 1
Администраторы
Сообщений:18097
Награды: 55


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

Здесь рассмотрим один из актуальных вариантов, в плане установки фонового решение, что будет установлено одном из нижних углов, что установка будет произведена в правой стороне, как уже ранее упоминалось.

Для этого нужно задействовать свойство background-position, но также можно применить оператор background, что изначально будет отвечать на настройки всех параметров фона.

Все желается на CSS

Код
html {
    height: 100%;
   }
   body {
    background: url(Здесь ссылка на картинку) right bottom no-repeat;
    padding-right: 200px;
   }

Здесь будет текст налаживаться на картинку, для того, чтоб такого не было, нужно выставить отступ, где задействуем padding-right. Тут нужно помнить и обратить внимание по высоте. Это все изначально связано, с заданным блоком, который находится внизу по правую сторону, а чтоб аналогично было в окне браузера, то необходимо растянуть родителя на всю высоту окна.

Вот так будет браузер выводить:



На каких браузерах корректно выводит по работе:

Прикрепления: 2712551.png(39.2 Kb) · 7583371.png(14.8 Kb)
Страна: (RU)
Форум » Веб-разработка » Скрипты сайтов HTML » Установить картинку в нужном углу сайта на CSS (Как правильно выставить картинку в правом нижнем углу сайта)
  • Страница 1 из 1
  • 1
Поиск: