0 / -2 / 2
Регистрация: 19.11.2016
Сообщений: 153

Как вставить картинку в список

04.12.2016, 17:09. Показов 30789. Ответов 8
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте, подскажите как ставить картинку типа стрелочку в список ul в одном из li в конце текста,
заранее благодарю .

 Комментарий модератора 
Создавайте темы с осмысленными и понятными названиями - это серьезно повышает шансы, что на ваш вопрос ответят.
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
04.12.2016, 17:09
Ответы с готовыми решениями:

HTML - Надо: вставить картинку в картинку, в эту картинку, ссылку в картинку
Вот схема моего сайта. http://s020.***********/i716/1404/8c/254516feacb3.jpg У меня пока что на этой странице есть: 1. Элемент Фон -...

Как в html вставить 2-картинку на 1-картинку???
Если 1-картинка не должна быть фоновая. пожалуйста поподробней.

выпадающий список, и в который можно вставить маленькую картинку с текстом
1)У меня есть один Label,Listbox,Button и 3 Radiobutton Мне надо если не выбрали Radiobutton чтоб в listBox не записывалась инфа и...

8
Эксперт JSЭксперт HTML/CSS
 Аватар для mrtoxas
3827 / 2677 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
04.12.2016, 18:27
Цитата Сообщение от Дмитрий0482 Посмотреть сообщение
в одном из li в конце текста
Вот тут поподробнее. В каком одном из?
0
0 / -2 / 2
Регистрация: 19.11.2016
Сообщений: 153
04.12.2016, 19:03  [ТС]
HTML5
1
2
3
4
5
<ul>
<li class="li">Главная</li>
<li class="uli">Перейти</li>
<li class="li">Контакты</li>
</ul>
например в li.uli
0
105 / 104 / 59
Регистрация: 21.10.2013
Сообщений: 346
04.12.2016, 19:39
Так???
HTML5
1
2
3
4
5
 <ul>
    <li class="li-img">конверт</li>
    <li>ножницы</li>
    <li>список</li>
  </ul>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
ul li {
  padding-left: 50px;
}
ul li + li {
  margin-top: 50px;
}
ul .li-img {
  position: relative;
}
ul .li-img:before {
  position: absolute;
  content: '';
  top: 50%;
  left: 0;
  width: 40px;
  height: 40px;
  background: url("https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcToVnHyvvEFzlHH5iG7KCVXW4AGn2enLTdljYKQglF1sPVt_nQl") red no-repeat -10px -10px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
Добавлено через 10 минут
Или
HTML5
1
2
3
4
5
<ul>
    <li>конверт <imd class="li-img"></imd></li>
    <li>ножницы</li>
    <li>список</li>
</ul>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
ul li {
  padding-left: 50px;
}
ul li + li {
  margin-top: 50px;
}
 
 
.li-img {
  position: relative;
}
 
.li-img:before {
  position: absolute;
  content: '';
  top: 50%;
  left: 0;
  width: 40px;
  height: 40px;
  background: url("https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcToVnHyvvEFzlHH5iG7KCVXW4AGn2enLTdljYKQglF1sPVt_nQl") red no-repeat -10px -10px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
0
0 / -2 / 2
Регистрация: 19.11.2016
Сообщений: 153
04.12.2016, 21:29  [ТС]
Cкажите будет так корректно или нет
HTML5
1
2
3
4
5
 <ul>
<li class="li"><p>Главная</p></li>
<li class="uli"><p>Перейти<img src="img/str.png"/></p></li>
<li class="li"><p>Контакты</p></li>
</ul>
0
04.12.2016, 21:29

Не по теме:

Цитата Сообщение от Kenworth Посмотреть сообщение
Или
А что за тег такой imd?

0
105 / 104 / 59
Регистрация: 21.10.2013
Сообщений: 346
04.12.2016, 21:52
mrtoxas,
Цитата Сообщение от mrtoxas Посмотреть сообщение
А что за тег такой imd?
опечатка + неудобная клавиатура[quote="Дмитрий0482;9852991"]<ul>

Дмитрий0482, если сомневаешься, корректно или валидно - то проверяй на validator.w3.org
А здесь то можно вместь <р> тег <a> вставить
Цитата Сообщение от Дмитрий0482 Посмотреть сообщение
<ul>
<li class="li"><p>Главная</p></li>
<li class="uli"><p>Перейти<img src="img/str.png"/></p></li>
<li class="li"><p>Контакты</p></li>
</ul>
0
04.12.2016, 21:57

Не по теме:

Kenworth, если имелось в виду img, то должен быть обязательный атрибут src. И у img нет псевдоэлементов.

0
0 / -2 / 2
Регистрация: 19.11.2016
Сообщений: 153
04.12.2016, 23:31  [ТС]
сделал так вроде работает
HTML5
1
2
3
4
5
<ul>
<li class="li"><a>Главная</a></li>
<li class="li"><a>Перейти<img class="img" src="img/str.png"/></a></li>
<li class="li"><a>Контакты</a></li>
</ul>
CSS
1
2
3
img.img{
positon:absolute;
}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
04.12.2016, 23:31
Помогаю со студенческими работами здесь

Как вставить картинку?
xaml: &lt;Ellipse x:Name=&quot;el&quot; Width=&quot;200&quot; Height=&quot;200&quot;&gt; &lt;Ellipse.Fill&gt; &lt;ImageBrush x:Name=&quot;img&quot; ImageSource=&quot;Image.jpg&quot;/&gt;...

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

Как вставить картинку
Долго бился. Наконец пришел к такому решению $im = PaintKrug($T, 300); // Рисование (моя функция) imagepng($im,...

Как вставить картинку!?
В пнрнменной $picture содержиться имя картинки! Пвтаюсь вставить её на страницу: &lt;img height ='200' width = '1240' src =...

Как вставить картинку в код?
Вот сам код.&lt;!DOCTYPE HTML PUBLIC &quot;-&quot;W3C//DTD HTML4.01//EN&quot; &quot;HTTP://WWW.W3.ORG/TR/HTML4/STRICT DTD&quot;&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt; boyan...


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

Или воспользуйтесь поиском по форуму:
9
Ответ Создать тему
Опции темы

Новые блоги и статьи
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
Создание Single Page Application на фреймах
krapotkin 16.11.2025
Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .
Фото: Daniel Greenwood
kumehtar 13.11.2025
Расскажи мне о Мире, бродяга
kumehtar 12.11.2025
— Расскажи мне о Мире, бродяга, Ты же видел моря и метели. Как сменялись короны и стяги, Как эпохи стрелою летели. - Этот мир — это крылья и горы, Снег и пламя, любовь и тревоги, И бескрайние. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru