Rumah > pembangunan bahagian belakang > tutorial php > 纯css实现图标按钮框架

纯css实现图标按钮框架

WBOY
Lepaskan: 2016-07-25 08:47:59
asal
1454 orang telah melayarinya
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实现图标按钮框架


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan