Занимательные флаги без использования изображений

Сегодня рассмотрим достаточно большой набор флагов государств, сделанных на чистом CSS, без единого графического файла.

-Чем это лучше изображений?

Тем, что вам не придётся хранить множество изображений и загружать их на странице. Это увеличит скорость загрузки страницы. Думаю, этого уже более чем достаточно.

Чтобы использовать эти флаги - подключите на своей странице css файл https://pastebin.com/barsikQS

Далее, для отображения флага, создайте контейнер с классом flag и классом, соответствующим названию страны.
Например:

<div class="main">
  <div class="flag maldives"></div>
  <div class="flag namibia"></div>
  <div class="flag qatar"></div>
  <div class="flag russia"></div>
  <div class="flag the-united-kingdom"></div>
</div>

Получите вы такие милые "изображения".

Регулировать размер флага можно свойством zoom и класса flag.
Например:

.flag {
  zoom:.8;
}

Список доступных стран

algeria, armenia, austria, azerbaijan, bahamas, bahrain, bangladesh, barbados, belgium, benin, bolivia, botswana, brazil, bulgaria, burkina-faso, burundi, cameroon, central-african-republic, chad, chile, colombia, comoros, costa-rica, cote-d-ivoire, cuba, czech-republic, democratic-republic-of-congo, denmark, djibouti, east-timor, estonia, finland, france, gabon, the-gambia, germany, ghana, greece, guinea, guinea-bissau, guyana, hungary, iceland, indonesia, iran, iraq, ireland, israel, italy, jamaica, japan, kuwait, laos, latvia, liberia, libya, lithuania, luxembourg, madagascar, malaysia, maldives, mali, mauritania, mauritius, monaco, myanmar, namibia, nauru, nepal, the-netherlands, niger, nigeria, north-korea, norway, pakistan, palau, panama, peru, poland, qatar, republic-of-china, republic-of-congo, romania, russia, rwanda, saint-kitts-and-nevis, saint-lucia, sao-tome-and-principe, senegal, seychelles, sierra-leone, somalia, south-sudan, sudan, suriname, sweden, switzerland, syria, tanzania, thailand, togo, tonga, trinidad-and-tobago, tunisia, turkey, ukraine, uae, the-united-kingdom, vietnam, western-sahara, yemen

В чём ещё преимущества такого подхода?

Всегда можно дописать стили с нужным флагом. Это проще, чем привлекать дизайнера, говорить ему размеры изображений. Плюс каждый дизайнер "рисует всё по-своему", и их работа будет несколько отличаться.

В чём недостатки?

Недостаток в том, что сложно будет отрисовать флаги со сложными изображениями, такими как животные или растения.
Например герб Мозамбика: