Как сделать чтобы фон картинкой для сайта

Как сделать чтобы фон картинкой для сайта

Как сделать картинку фоном в html, код, примеры, background, image.

Прежде чем ставить картинку на задний фон, то нужно учитывать, что в зависимости от разрешения картинки, задний фон будет на весь экран, либо будет занимать всего лишь часть!

Картинку на задний фон можно поставить несколькими способами:

1.Вставить код в саму страницу.

2.Использовать css.

Для того, чтобы это увидеть, как это будет выглядеть, будем создавать новую страницу для каждого варианта.

1.

Как поставить картинку на задний фон страницы?

Пропишем в самой странице код заднего фона.

Опять же, для этого есть несколько вариантов решения:

А.

Изменим  код на странице:

<body>

На такой:

<body background="http://axmara.narod.ru/1_foto/primer-oboev.jpg">

Где

http://axmara.narod.ru/1_foto/primer-oboev.jpg – путь до моей картинки.

Код страницы будет такой:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Документ без названия</title>
</head>
<body background="http://axmara.narod.ru/1_foto/primer-oboev.jpg">
</body>
</html>

Пример.

Б.

С использованием стилей css, но все равно в самой странице.

После титлов вставляем такой код:

<style type="text/css">

<!--

/ CSS Document /

body{

background-image:url(http://axmara.narod.ru/1_foto/primer-oboev.jpg)

}

-->

</style>

Код страницы будет такой:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Документ без названия</title>
<style type="text/css">
<!--
/ CSS Document /
body{
background-image:url(http://axmara.narod.ru/1_foto/primer-oboev.jpg)
}
-->
</style>
</head>
<body>
</body>
</html>

Пример.

Как поставить на задний фон картинку с помощью css.

Здесь имеется ввиду css = отдельный файл css.

2.

Для этого нам потребуется:

А.Создать  файл стилей css .

Б.Прописать код с задним фоном а файле стилей.

В.Прикрепить  файл стилей css к нашей странице.

А.

Для использования css для заднего фона, создадим отдельный файл стилей css, назовём его  

Zadniy-fon-kartinka.css

Смотрим на него.

Б.

В самом файле стилей css, делаем такую надпись:

body{ background-image: url(http://axmara.narod.ru/1_foto/background/primer-background.jpg);

В.

Прикрепим его к странице, написав такой текст ниже титлов:

<link rel="stylesheet" href="http://axmara.narod.ru/site/background/Zadniy-fon-kartinka.css" type="text/css">

Код страницы будет такой:

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>Название страницы</title>

<link rel="stylesheet" href="http://axmara.narod.ru/site/background/Zadniy-fon-kartinka.css" type="text/css">

</head>

<body>

</body>

</html>

Путь до файла -

http://axmara.narod.ru/site/background/Zadniy-fon-kartinka.css

Смотрим, что у нас получилось.

Не нажали на рекламное объявление!?

Ничего страшного!

Вы ещё можете помочь проекту!

Да не оскудеет рука дающего!

Друзья! Мы тратим время + деньги и работаем для Вас, чтобы Вы смогли получить информацию!

Если у Вас есть время, чтобы оценить нашу работу, оставить сообщение в комментариях, поделиться ссылкой в соцсетях - это будет очень великодушно с Вашей стороны!

И мы будем Вам очень признательны за такие действия!

Заранее спасибо!

Как сделать чтобы фон картинкой для сайта 442
Как сделать чтобы фон картинкой для сайта 511
Как сделать чтобы фон картинкой для сайта 478
Как сделать чтобы фон картинкой для сайта 9
Как сделать чтобы фон картинкой для сайта 952
Как сделать чтобы фон картинкой для сайта 104
Как сделать чтобы фон картинкой для сайта 521
Как сделать чтобы фон картинкой для сайта 341
Как сделать чтобы фон картинкой для сайта 86
Как сделать чтобы фон картинкой для сайта 953
Как сделать чтобы фон картинкой для сайта 755
Как сделать чтобы фон картинкой для сайта 897
Как сделать чтобы фон картинкой для сайта 177
Как сделать чтобы фон картинкой для сайта 222
Как сделать чтобы фон картинкой для сайта 580
Как сделать чтобы фон картинкой для сайта 533
Как сделать чтобы фон картинкой для сайта 480
Как сделать чтобы фон картинкой для сайта 815
Как сделать чтобы фон картинкой для сайта 860

Похожие записи:

  • Как сделать себе рисунки на ногтях для начинающих
  • Как рассадить за кактусами в домашних условиях
  • Как сажать семена туй
  • Поздравление в стихах на телефон
  • Как самой сделать себе портрет