Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.71/21: Рейтинг темы: голосов - 21, средняя оценка - 4.71
 Аватар для Kazukari
0 / 0 / 0
Регистрация: 23.12.2012
Сообщений: 19

Как добавить картинку в css?

15.10.2015, 09:06. Показов 4334. Ответов 1
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Вот такая задача:
Это задание выполняется с использованием CSS.
Причем описание стилей поместите во внешний файл style-ezhik.css:
Для всего документа установите фоновый рисунок, используя файл sky.gif из папки images (при этом перемещать файл из папки не разрешается! Используйте относительную адресацию).
Для размещения контента на экране создайте селекторы по идентификатору:
main — основной блок: шириной 800 пикселов, размещенный по центру окна браузера;
head — для размещения оглавления: с фоновым изображением из файла ris.gif из папки images,
шириной и высотой в пикселах точно совпадающим с размерами изображения ris.gif,
этот блок должен разместиться по центру, а вот верхнее и нижнее поля задайте равными по 25 пикселов.
menu — для размещения пунктов оглавления: плавающий блок прижатый к правому краю, шириной 300 пикселов,
с верхним отступом равным 25 пикселов и остальными отступами по 15 пикселов,
для текста в этом блоке задайте полужирный шрифт, курсивное начертание, размер шрифта 12 пунктов, гарнитура Arial.
Для заголовка Н2 задайте цвет: #333399, гарнитуру Arial, курсивное начертание.
Для заголовка Н3 задайте цвет: #333399, гарнитуру Arial, размещение по центру.
Для абзацев установите выравнивание по ширине и отступ первой строки («красную строку») в 2em
Поскольку оглавление будет сделано как маркированный список, то для него задайте маркеры — как картинки из файла paw.gif из папки images, а для пунктов списка установите размер шрифта 11 пунктов и верхнее поле в 10 пикселов.
Создайте класс r — для размещения блока у правого края, с верхним и нижним полями по 15 пикселов.
Вот что я сделал:
CSS
1
2
3
4
5
6
7
8
9
BODY {background-image: URL(images/sky.gif);}
#main {width: 800px; margin: auto;}
#head {background-image: URL(imges/ris.gif); padding: 1em;
margin-left: auto; margin-right: auto; /* поля для центрирования блока */}
#menu {width: 300px; margin-top: 25px; margin: 15px; font-weight: bold; font-style: italic; font-size: 12pt; font-family: Arial;}
Н2 {color: #333399; font-family: Arial; font-style: italic;}
Н3 {color: #333399; font-family: Arial; text-align: center; text-decoration: line-through;}
P {text-indent: 5em}
UL {list-style-image: URL(images/paw.gif); font-size: 11pt;}
в первом BODY фон появился, но в head нет. Помогите пожалуйста.
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
15.10.2015, 09:06
Ответы с готовыми решениями:

Как растянуть картинку? CSS
Как растянуть картинку которая стоит на фоне текста(картинка с анимацией)? Вот код: .menu a:hover{background-image:...

Как добавить "картинку на картинку" при наведении?
Нужно сделать так как на этом сайте - http://www.break.com/ - не удаляйте ссылку не раклама При наведении на картинку появляется...

Как нарисовать такую картинку с помощью CSS?
Ребят,как нарисовать такую картинку с помощью CSS?Хотя может вы подскажите решение другое,у меня есть пункты меню но все они разной длинные...

1
0 / 0 / 0
Регистрация: 14.10.2015
Сообщений: 11
15.10.2015, 10:37
Не совсем конечно понятно без примера. Попробуй добавить для head width и height для изображения.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
15.10.2015, 10:37
Помогаю со студенческими работами здесь

Как вставить картинку при помомщи css и html
Ребят, подскажите, пожалуйста, как вставить картинку при помощи css, а потом её вынести при помощи html? Вот моя последовательность...

Как добавить картинку в textarea
Здравствуйте! Как добавить смайлик в тег textarea чтобы кликать можно было, пока только один вариант через псевдокласс я думаю

Как добавить текст на картинку?
<td height="60" colspan="2" ><img src="image/up.png" width=100% height="60" /></td> Картинку нужно добавить не как картинку фона, а...

Как адаптировать картинку с помощью бутстраповской сетки или средствами HTML/CSS
Не знаю как адаптировать картинку в шапке сайта. Уже брал проект,где вообще медиазапросы блокировались и поэтому можно было использовать...

Как добавить картинку на фон другой картинки?
Здравствуйте! Вызываю значит картинку: <img src="http://kartinka.png" width="150" height="150 alt="kartinka"> ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android
8Observer8 26.01.2026
Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .
Установка Android SDK, NDK, JDK, CMake и т.д.
8Observer8 25.01.2026
Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .
Вывод текста со шрифтом 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 полиномов. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru