www.gusucode.com > 10多款支持进度条显示的CSS3按钮特效源码程序 > 10多款支持进度条显示的CSS3按钮特效/带进度条的按钮/带进度条的按钮/css/demo.css
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700); @font-face { font-family: 'codropsicons'; src:url('../fonts/codropsicons/codropsicons.eot'); src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'), url('../fonts/codropsicons/codropsicons.woff') format('woff'), url('../fonts/codropsicons/codropsicons.ttf') format('truetype'), url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg'); font-weight: normal; font-style: normal; } body { background: #27ae60; color: #fff; font-family: 'Lato', Arial, sans-serif; } .clearfix:before, .clearfix:after { content: ''; display: table; } .clearfix:after { clear: both; } a { color: #148544; text-decoration: none; outline: none; } a:hover, a:focus { color: #fff; } .container > header { margin: 0 auto 2em; padding: 2em; text-align: center; background: rgba(0,0,0,0.01); } .container > header h1 { font-size: 3.5em; line-height: 1.3; margin: 0; font-weight: 300; } .container > header span { display: block; font-size: 60%; color: #148544; padding: 0.3em 0 0.6em 0.1em; } .note { color: #85cd62; } /* To Navigation Style */ .codrops-top { text-transform: uppercase; width: 100%; font-size: 0.69em; line-height: 2.2; font-weight: 700; } .codrops-top a { text-decoration: none; padding: 0 1em; letter-spacing: 0.1em; display: inline-block; } .codrops-top span.right { float: right; } .codrops-top span.right a { float: left; display: block; } .codrops-icon:before { font-family: 'codropsicons'; margin: 0 4px; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } .codrops-icon-drop:before { content: "\e001"; } .codrops-icon-prev:before { content: "\e004"; } .wrapper { text-align: center; vertical-align: top; } section { position: relative; text-align: center; padding: 1em 1em 3em; } .wrapper section { display: inline-block; width: 300px; } section h2 { text-transform: uppercase; letter-spacing: 1px; color: #148544; font-weight: 700; padding: 1em; font-size: 0.8em; -webkit-backface-visibility: hidden; } .related { font-size: 2em; font-weight: 300; } @media screen and (max-width: 25em) { .container > header { font-size: 70%; } .related { font-size: 120%; } .codrops-icon span { display: none; } }