flag icons

旗帜图标

SVG 中所有国旗的精选集合 - 以及更容易集成的 CSS。请参阅演示。

安装

您可以按原样下载整个项目，也可以通过 npm 或 Yarn 安装它：

npm install flag-icons
# or
yarn add flag-icons

用法

首先，您需要导入CSS：

 import "/node_modules/flag-icons/css/flag-icons.min.css" ;

或使用CDN：

 < link
  rel =" stylesheet "
  href =" https://cdn.jsdelivr.net/gh/lipis/[email protected]/css/flag-icons.min.css "
/>

要使用与文本内联的标志，请将类.fi和.fi-xx （其中xx是国家/地区的 ISO 3166-1-alpha-2 代码）添加到空<span> 。如果你想要一个平方版本标志，那么也添加类fis 。例子：

 < span class =" fi fi-gr " > </ span > < span class =" fi fi-gr fis " > </ span >

您也可以将此应用于任何元素，但在这种情况下，您必须使用fib而不是fi并且您已设置完毕。这将添加具有以下 CSS 属性的正确背景：

 background-size : contain;
background-position : 50 % ;
background-repeat : no-repeat;

这意味着该标志将出现在元素的中间，因此您必须手动设置 4 x 3 比例的正确大小，或者如果它是平方的，则还添加flag-icon-squared类。

发展

克隆项目后运行yarn来安装依赖项，您将能够：

构建*.scss文件

$ yarn build

在localhost:8000上提供服务

$ yarn start

要在 css 文件中仅包含特定国家/地区，请从_flag-icons-list.scss文件中删除不需要的国家/地区，然后重新构建。

制作人员

• 如果没有 koppi 提供的令人惊叹且现已删除的 SVG 标志集合，这个项目就不会存在。
• 感谢 Andrejs Abrickis 在 npm 上提供了flag-icons名称。