Я взял флажки Никиты Иванова и собрал их в одном спрайте для более удобного и оптимального использования на сайтах. Мне кажется, то, что получилось, может пригодиться и вам в своей работе.
Слово Никите:
Однажды мне понадобились маленькие пиктограммы всех государственных флагов на свете. Причём, в них не должно было быть игрушечной веб-два-нольной глянцевости и «весёленьких» искажённых цветов. Как ни странно, мне не удалось найти ничего подходящего — поэтому я взялся за эту работу самостоятельно.
Значок
российского флага стал маленькой и чёткой копией нашего триколора. Такими же аккуратными получились флаги, например,Ямайки или Греции . А над флагамиАвстралии и Британии пришлосьчуть-чуть попотеть.
Оригинальный архив с пиктограммами можно скачать на сайте Никиты Иванова,
На вебе же лучше использовать спрайт, так как он ещё легче — 31 КБ, и за два запроса к серверу
Сохраните flags.css
и flags.png
из архива на своём сервере в любой удобной папке, в моём примере эти файлы якобы в одном месте с ХТМЛ.
ЦСС подключается обычным способом, а спрайт упоминается там, где нужна пиктограмма:
Эти летом я был:Значок флага нужной страны получить очень просто, вставьте её код в названии класса любого пустого элемента, вот так:
— российский триколор,
— французский.
В большинстве случаев коды пиктограмм совпадают с официальными кодами стандарта ISO_3166-2, в исключениях некоторые непризнанные государства и несуверенные регионы:
Кстати, в архиве кроме спрайта есть массивы кодов и наименований стран в разных форматах (JS, JSON, SQL) для удобного перебора флагов в этом спрайте. Они могут пригодится, например, если вы задумаете при автодополнении страны тут же подгружать флажок.
Здесь с помощью такого массива я показываю все флаги, по-разному сортирую их, вывожу случайную пиктограмму.
Думаю, тот, кому понадобятся массивы, разберётся без меня, как ими пользоваться.
flags.zip
Спрайт, ЦСС к нему и тестовая страница.
В папке extra
лежат файлы с массивами названий стран на двух языках и их кодов — flags.js
, flags.json
, flags_mapping.json
и даже flags.sql
.
Заглянуть внутрь исходников, .psd и .sass, можно на Гитхабе.
Набор распостраняется на условиях лицензии