как изменить код, что бы картинка была в правом нижнем углу и была одна а не 2

голоса: 0

как изменить код, что бы картинка была в правом нижнем углу и была одна а не 2 или 3 растянутых, там где "оглавление" чересчур пусто хотелось бы сделать фон за ссылками на другие страницы, что бы была допустим какая то картинка и не сдвигала текст

#cont-i {padding:20px;background:#fff url(ссылка на картинку);-moz-box-shadow:0 1px 2px rgba(0,0,0,.5);-webkit-box-shadow:0 1px 2px rgba(0,0,0,.5);box-shadow:0 1px 2px rgba(0,0,0,.5);-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;}
 

Адрес сайта http://aquarepair.ucoz.net/
| Автор: | Категория: Дизайн сайта

Ответов: 2

голоса: 0
 
Лучший ответ

Добавьте в табилцу стилей CSS следуюище стили:

#cont-i:after {
    right: 36%;
    content:"";
    margin-top: -30px; /*отступ от нижнего бордюра*/
    width:36px; /*ширина изображения*/
    height:36px; /*высота изображения*/
    background: url(здесь ссылка на ваше изображение капельку или что там)no-repeat;
    position: absolute;
}

текущее изображение http://genesacua.ucoz.net/Untitled-3.png не подойдет так как там размер 300х300, а нужно от 16х16 / 24х24 / 36х36 / 48х48 но не 300х300 ищите более подходящую иконку.

| Автор:
Выбор ответа лучшим | | Автор: :) AquaRepair
пробовал и заменить и добавить, только почему то фон страницы становится прозрачным и картинки нет
картинка появилась, но вот проблема она за листом, а как ее поставить на листе?

вроде все отлично отображается, на листе, а не за ним:

Что-то не выходит..

замените стили выше на:

#cont-i:after {
 float: right;
 content: "";
 margin-top: -30px; /*отступ от нижнего бордюра*/
 width:36px; /*ширина изображения*/
 height:36px; /*высота изображения*/
 background: url(http://aquarepair.ucoz.net/Untitled-1.jpg)no-repeat;
}

так будет более правильно.

я чайник, понял! спасибо!
найдите изображение нужных размеров и замените ссылку в стилях, далее я так же прописал комментарии в стилях, пропишите новые рамзеры для иконки
голоса: 0

для вашего решения вы можете использовать безшовные картинки небольшого размера, которые будут повторяться, вот пример рисунка

 

 

вот результат

| Автор:
я понял, но мне бы хотелось просто в правый нижний угол скромно поставить капельку 1 или ванну 1
(извините, за возможно глупые вопросы, но я чайник:))
...