Community Learn Tools Library Leisure

English

Home > Backend Development > PHP Tutorial > Pure css implementation of icon button framework

Pure css implementation of icon button framework

WBOY

Release： 2016-07-25 08:47:59

Original

1457 people have browsed it

Icon size for fa-lg (increased by 33%), fa-2x, fa-3x, fa-4x, or fa-5x class.

fa-stack-1x fixed size icons, fa-stack-2x

Use arbitrary rotation and flipping icons fa-rotate-* and fa-flip-* classes. *How many degrees does it represent: fa-rotate-90

Use the fa-spin rotation class to get any icon. Can handle fa-spinner, fa-refresh, fa-cog well.

fa-border border

Demo address demo:
http://www.0917cc.com/blog/b926.htm

@font-face {
font-family: 'FontAwesome';
src: url('../fonts/fontawesome-webfont.eot?v=4.1.0');
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');
font-weight: normal;
font-style: normal;
}

Copy code

WeChat icon
< a href='#' class="svn_btn3 p5">WeChat icon
WeChat icon

Copy code

Pure css implementation of icon button framework

Related labels：

纯css实现图标按钮框架

source：php.cn

Previous article：Free download of LAMP+LNMP environment construction video tutorial! Next article：pdo operation makes sqlite compatible with more sql statements.

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn