Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.55/11: Рейтинг темы: голосов - 11, средняя оценка - 4.55
0 / 0 / 1
Регистрация: 18.09.2013
Сообщений: 79
1

Заменить тег select на картинку

17.08.2014, 18:14. Просмотров 2144. Ответов 3
Метки нет (Все метки)

подскажите как заменить в тэге <select> стандартный треугольник на красивую картинку?
Спасибо.
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
17.08.2014, 18:14
Ответы с готовыми решениями:

Тег SELECT
Проблема в IE 6. Он не реагирует на ширину SELECTа, всё равно оставляет его равным самой длинной...

Тег SELECT (Выбор)
Всем привет! Как сдлеать селект вот: &lt;select&gt; ***&lt;option&gt;Пункт 1&lt;/option&gt; ***&lt;option&gt;Пункт...

Тег select не работает в Firefox
Здравствуйте. В FireFox не работает вот этот кусок текста &lt;select name=&quot;country&quot;&gt; &lt;option...

Тег SELECT - выровнять текст по центру (IE)
Есть выпадающий список &lt;select&gt; В нем несколько &lt;option&gt; Нужно сделать так, чтобы в SELECT...

3
32 / 31 / 9
Регистрация: 27.07.2014
Сообщений: 186
17.08.2014, 22:40 2
Лучше использовать jquery-плагины, css-стилизация select'a очень ненадежная в плане кроссбраузерности
0
327 / 217 / 97
Регистрация: 04.11.2012
Сообщений: 638
18.08.2014, 11:50 3
Лучший ответ Сообщение было отмечено Taatshi как решение

Решение

Цитата Сообщение от B@ndit Посмотреть сообщение
подскажите как заменить в тэге <select> стандартный треугольник на красивую картинку?
Примерно так можно http://jsbin.com/duxux/1/ , только заместо "+" подставите свою картинку.
HTML5
1
2
3
4
5
6
7
8
<div class="select">
  <select>
    <option value="some">some1</option>
    <option value="some">some2</option>
    <option value="some">some4</option>
  </select>
  <div class="arrow">+</div>
</div>
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
29
30
31
32
33
34
35
* {
  margin: 0;
  padding: 0;
}
 
select {
  width: 500px;
  padding: 5px 10px;
  border: none;
  background: transparent;
  position: relative;
  z-index: 20;
}
 
.select {
  width: 200px;
  overflow: hidden;
  position: relative;
  border: 1px solid #999;
  background: #fff;
  border-radius: 5px;
  margin: 50px;
}
 
.arrow {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 30px;
  text-align: center;
  padding-top: 5px;
  background: #ccc;
  z-index: 10;
}
Цитата Сообщение от Eugene-nsk Посмотреть сообщение
css-стилизация select'a очень ненадежная в плане кроссбраузерности
Плюсую
1
0 / 0 / 1
Регистрация: 18.09.2013
Сообщений: 79
19.08.2014, 17:26  [ТС] 4
спасибо за помощь ))
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
19.08.2014, 17:26

Заказываю контрольные, курсовые, дипломные и любые другие студенческие работы здесь.

Чем заменить тег <center>?
В CSS3 нет эквивалента тегу &lt;center&gt;&lt;/center&gt; ? Прочитал кучу способов, ни так и не смог...

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

Как заменить тег в результате на другой тег или спец символ
Здравствуйте, может кто сталкивался с такой задачей. Парсер парсит результат между тегами &lt;p&gt;&lt;/p&gt;....

тег select + mysql
есть база данных с таблицей растениеводство. Есть select. В него я вывожу из базы культуру. Это я...


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

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

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2020, vBulletin Solutions, Inc.