Как задать фоновое изображение для div?

Question

Андрей Любименко @andrewlybimenko

HTML
CSS

Как задать фоновое изображение для div?

Приветствую,подскажите пожалуйста как реализовать следующее:
Есть контейнер div определённого размера 200x1000px, хочу вместить в этот контейнер фон - картинку, с её повторением по оси x, и наверх этого контейнера(наверх по фону) наложить ещё картинку меньшего размера и справа от неё надпись, не могу понять чего не хватает - изображение не загружается на фон, выскакивает снизу,где угодно - но не внутри под другой картинкой.Подскажите пожалуйста в чём ошибка;

Вопрос задан более трёх лет назад
87 просмотров

2 комментария

Подписаться 1 Простой 2 комментария

Eugene Chefranov @Chefranov

приведите ваш код

Написано более трёх лет назад

Андрей Любименко @andrewlybimenko Автор вопроса

<!DOCTYPE html>
<html>
<head>
	<title>Пробый div</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<div class="footer">
		<div class="fon"></div>
		<div class="img">
			<img src="footer1.png" alt="картинка1">
			<p>Текст который должен распологаться справа от картинки </p>
		</div>
	</div>
</body>
</html>

.footer{
	height:200px;
	width: 1000px;
	border:1px solid black;
}
.fon{
	background: url(footerFon.png) repeat-x;
	height: 195px;
	left: 0;
	bottom: 0;
	position: absolute;
	float: left;
}
.img{
	height: 30px;
	width: 30px;
	float: left;
}

Написано более трёх лет назад

Решения вопроса 1

3 комментария

Пригласить эксперта

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации

Похожие вопросы

CSS

Простой
Как убрать полосы у скругленных углов?
- 1 подписчик
- 13 часов назад
- 75 просмотров
1

ответ
JavaScript

+2 ещё

Средний
Swiper-slider c cube-эффектом перекрывает чётные слайды?
- 1 подписчик
- вчера
- 68 просмотров
0

ответов
CSS

Простой
Как сделать hover у вертикального градиента?
- 1 подписчик
- вчера
- 58 просмотров
1

ответ
HTML

+2 ещё

Средний
Как сделать рамки с помощью css или с помощью svg для изображений и вписать изображения туда?
- 1 подписчик
- вчера
- 57 просмотров
0

ответов
JavaScript

+1 ещё

Простой
Как передать несколько параметров js?
- 1 подписчик
- вчера
- 103 просмотра
1

ответ
HTML

Простой
Где можно создать image map? Есть рабочие онлайн-сервисы для этого?
- 3 подписчика
- вчера
- 457 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Как передать данные с одной страницы на другую без изменения url?
- 2 подписчика
- вчера
- 147 просмотров
1

ответ
HTML

+1 ещё

Простой
Объект накладываемый на фон становится полупрозрачный, как исправить?
- нет подписчиков
- вчера
- 72 просмотра
1

ответ
JavaScript

+1 ещё

Простой
Как сделать центрирование кнопки смещая скролл по нажатию на эту кнопку?
- 1 подписчик
- вчера
- 71 просмотр
1

ответ
JavaScript

+2 ещё

Простой
Как сконвертировать color-mix в rgb/hex?
- 1 подписчик
- вчера
- 70 просмотров
1

ответ
Показать ещё Загружается…

HTML-верстальщик (HTML/CSS/JavaScript)

CleanTalk

от 100 000 ₽

Frontend-разработчик (React)

ДАЛЕЕ

от 140 000 ₽

Тестировщик-стажёр

ITooLabs • Тула

от 35 000 до 40 000 ₽

Поиск клиентов

21 мая 2024, в 23:47

30000 руб./за проект

Нужно запустить один проект в Android Studio и проверить на работу

21 мая 2024, в 23:44

1 руб./за проект

Онлайн представитель проекта

21 мая 2024, в 22:05

90000 руб./за проект

<!DOCTYPE html> <html> <head> <title>Пробый div</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div class="footer"> <div class="fon"></div> <div class="img"> <img src="footer1.png" alt="картинка1"> <p>Текст который должен распологаться справа от картинки </p> </div> </div> </body> </html>

.footer{ height:200px; width: 1000px; border:1px solid black; } .fon{ background: url(footerFon.png) repeat-x; height: 195px; left: 0; bottom: 0; position: absolute; float: left; } .img{ height: 30px; width: 30px; float: left; }

Answer 1 · 2018-10-05 12:52:09

dicem @dicem

Я конечно мейби ничего не понимаю в вашем вопросе но вот:

Ответ написан более трёх лет назад

3 комментария

Как задать фоновое изображение для div?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт