Maison  >  Article  >  développement back-end  >  纯css实现图标按钮框架

纯css实现图标按钮框架

WBOY
WBOYoriginal
2016-07-25 08:47:591413parcourir
fa-lg图标大小(增加33%), fa-2x, fa-3x, fa-4x,或 fa-5x类。

fa-stack-1x固定大小的图标, fa-stack-2x

使用任意旋转和翻转图标 fa-rotate-*和 fa-flip-*类。 *代表多少度:fa-rotate-90

使用 fa-spin旋转类得到任何图标。能够很好地处理 fa-spinner, fa-refresh, fa-cog.

fa-border 边框

演示地址demo:
http://www.0917cc.com/blog/b926.htm
  1. @font-face {
  2. font-family: 'FontAwesome';
  3. src: url('../fonts/fontawesome-webfont.eot?v=4.1.0');
  4. src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  5. font-weight: normal;
  6. font-style: normal;
  7. }
复制代码
纯css实现图标按钮框架


Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn