Выбрать страницу

Здравствуйте, наверное вам не раз пришлось сталкиваться с проблемой, которая возникает при стилизации выпадающего списка. И решить эту задачу используя только CSS не удастся.

К вам на помощь спешит замечательный jQuery плагин, который называется Select2. С его помощью можно стилизовать выпадающий список как вам будет угодно, со всеми его возможностями вы можете ознакомиться по ссылке:

https://select2.github.io/examples.html

Там вы точно найдете то что вам нужно. 

Еще небольшое дополнения, недавно возникла ситуация, когда нужно было стилизовать по разному два выпадающих списка на одной странице. Чтобы это сделать, вам нужно присвоить уникальный класс каждому select. Это можно сделать используя следующие настройки при инициализации списка:

containerCssClass  — добавит класс к контейнеру на который вы будете нажимать чтобы вызвать список.

dropdownCssClass — добавит класс к контейнеру который будет выпадать.

После этого добавить стили сущие пустяки=)

Также можно прописать сразу стили используя containerCss и dropdownCss соответственно. Более детально можно прочитать здесь:

https://github.com/select2/select2/issues/285

Спасибо за внимание, будут вопросы обращайтесь.