Buttons一个高度 CSS 样式库,可定制的按钮(button)。

Buttons一个高度 CSS 样式库,可定制的按钮(button)。

这是一个开源的Buttons 是一个高度可定制的、免费并且开源的按钮 CSS 样式库。

下载地址: https://download.jv98.com/buttons.css

Buttons一个高度 CSS 样式库,可定制的按钮(button)

代码:

 

<div class="showcase-examples l-center">
<a href="http://www.bootcss.com/" class="button button-tiny">Go</a>
<a href="http://www.bootcss.com/" class="button button-rounded button-tiny">Go</a>
<a href="http://www.bootcss.com/" class="button button-pill button-tiny">Go</a>
<button class="button button-square button-tiny"><i class="fa fa-plus"></i></button>
<button class="button button-box button-tiny"><i class="fa fa-plus"></i></button>
<button class="button button-circle button-tiny"><i class="fa fa-plus"></i></button>
<br/>
<a href="http://www.bootcss.com/" class="button button-primary button-small">Go</a>
<a href="http://www.bootcss.com/" class="button button-primary button-rounded button-small">Go</a>
<a href="http://www.bootcss.com/" class="button button-primary button-pill button-small">Go</a>
<button class="button button-primary button-square button-small"><i class="fa fa-plus"></i></button>
<button class="button button-primary button-box button-small"><i class="fa fa-plus"></i></button>
<button class="button button-primary button-circle button-small"><i class="fa fa-plus"></i></button>
<br/>
<a href="http://www.bootcss.com/" class="button button-action">Go</a>
<a href="http://www.bootcss.com/" class="button button-action button-rounded">Go</a>
<a href="http://www.bootcss.com/" class="button button-action button-pill">Go</a>
<button class="button button-action button-square"><i class="fa fa-plus"></i></button>
<button class="button button-action button-box"><i class="fa fa-plus"></i></button>
<button class="button button-action button-circle"><i class="fa fa-plus"></i></button>
<br/>
<a href="http://www.bootcss.com/" class="button button-highlight button-large">Go</a>
<a href="http://www.bootcss.com/" class="button button-highlight button-rounded button-large">Go</a>
<a href="http://www.bootcss.com/" class="button button-highlight button-pill button-large">Go</a>
<button class="button button-highlight button-square button-large"><i class="fa fa-plus"></i></button>
<button class="button button-highlight button-box button-large"><i class="fa fa-plus"></i></button>
<button class="button button-highlight button-circle button-large"><i class="fa fa-plus"></i></button>
<br/>
<a href="http://www.bootcss.com/" class="button button-caution button-jumbo">Go</a>
<a href="http://www.bootcss.com/" class="button button-caution button-rounded button-jumbo">Go</a>
<a href="http://www.bootcss.com/" class="button button-caution button-pill button-jumbo">Go</a>
<button class="button button-caution button-square button-jumbo"><i class="fa fa-plus"></i></button>
<button class="button button-caution button-box button-jumbo"><i class="fa fa-plus"></i></button>
<button class="button button-caution button-circle button-jumbo"><i class="fa fa-plus"></i></button>
<br/>
<a href="http://www.bootcss.com/" class="button button-royal button-giant">Go</a>
<a href="http://www.bootcss.com/" class="button button-royal button-rounded button-giant">Go</a>
<a href="http://www.bootcss.com/" class="button button-royal button-pill button-giant">Go</a>
<button class="button button-royal button-square button-giant"><i class="fa fa-plus"></i></button>
<button class="button button-royal button-box button-giant"><i class="fa fa-plus"></i></button>
<button class="button button-royal button-circle button-giant"><i class="fa fa-plus"></i></button>
</div>

Buttons一个高度 CSS 样式库,可定制的按钮(button)
代码:

 

<div class="showcase-examples l-center">
<button class="button button-3d button-box button-jumbo"><i class="fa fa-thumbs-up"></i></button>
<a href="http://www.bootcss.com/" class="button button-3d button-primary button-rounded">Check out the new site!</a>
<a href="http://www.bootcss.com/" class="button button-3d button-action button-pill">Visit Us!</a>
<button class="button button-3d button-action button-circle button-jumbo"><i class="fa fa-thumbs-up"></i></button>
<a href="http://www.bootcss.com/" class="button button-3d button-caution"><i class="fa fa-camera"></i> Go</a>
<a href="http://www.bootcss.com/" class="button button-3d button-royal">Say Hi!</a>

</div>

Buttons一个高度 CSS 样式库,可定制的按钮(button)
代码:

<div class="showcase-examples l-center">
  <button class="button button-large button-plain button-border button-circle"><i class="fa fa-reply"></i></button>
  <button class="button button-large button-plain button-border button-box"><i class="fa fa-star"></i></button>
  <button class="button button-large button-plain button-border button-square"><i class="fa fa-trash-o"></i></button>
  <button class="button button-large button-plain button-borderless"><i class="fa fa-tag"></i></button>
  </div>

Buttons一个高度 CSS 样式库,可定制的按钮(button)
代码:

<div class="showcase-examples l-center l-longshadows">
  <button class="button button-primary button-box button-giant button-longshadow-right">
    <i class="fa fa-twitter"></i>
  </button>
  <button class="button button-caution button-box button-raised button-giant button-longshadow">
    <i class="fa fa-google-plus"></i>
  </button>
  <button class="button button-action button-box button-giant button-longshadow-left">
    <i class="fa fa-share-alt"></i>
  </button>
  <button class="button button-highlight button-box button-giant button-longshadow-right button-longshadow-expand">
    <i class="fa fa-rss"></i>
  </button>
  <button class="button button-primary button-circle button-giant button-longshadow">
    <i class="fa fa-gear"></i>
  </button></div>

<div class="showcase-examples l-center">
  <a href="http://www.bootcss.com/" class="button button-raised button-primary button-pill">Visit Us!</a>
  <button class="button button-raised button-action button-circle button-jumbo"><i class="fa fa-thumbs-up"></i></button>
  <a href="http://www.bootcss.com/" class="button button-raised button-caution"><i class="fa fa-camera"></i> Go</a>
  <a href="http://www.bootcss.com/" class="button button-raised button-royal">Say Hi!</a>
  <a href="http://www.bootcss.com/" class="button button-raised button-pill button-inverse">Say Hi!</a>
  </div>

Buttons一个高度 CSS 样式库,可定制的按钮(button)
代码:

<div class="showcase-examples l-over l-center">
  <a href="http://www.bootcss.com/" class="button button-glow button-rounded button-raised button-primary">Go</a>
  <a href="http://www.bootcss.com/" class="button button-glow button-border button-rounded button-primary">Go</a>
  <button class="button button-glow button-circle button-action button-jumbo"><i class="fa fa-thumbs-up"></i></button>
  <a href="http://www.bootcss.com/" class="button button-glow button-rounded button-highlight">Go</a>
  <a href="http://www.bootcss.com/" class="button button-glow button-rounded button-caution">Go</a>
  <a href="http://www.bootcss.com/" class="button button-glow button-rounded button-royal">Go</a>
  </div>

<button class="button button-rounded">
      Select Me <i class="fa fa-caret-down"></i>
    </button>
<button class="button button-primary button-large">
      <i class="fa fa-bars"></i> Select Me
    </button>
<button class="button button-action">
      Select Me <i class="fa fa-caret-up"></i>
    </button>
<button class="button button-caution button-pill">
      Select Me <i class="fa fa-caret-down"></i>
    </button>

Buttons一个高度 CSS 样式库,可定制的按钮(button)
代码:


1<div class="showcase-examples l-center">
  <input type="submit" value="Go" class="button button-pill button-primary">
  <button class="button button-pill button-primary">Go</button>
  <!-- DISABLED BUTTONS -->
  <input disabled="" type="submit" value="Go" class="button button-pill button-primary">
  <button disabled="" class="button  button-pill button-primary">Go</button>
  <button disabled="" class="button button-pill button-flat-primary">Go</button>
  <a href="#" class="button disabled button-pill button-primary ">Go</a></div>
  
  <div class="showcase-examples l-center">
  <a href="http://www.bootcss.com/" class="button button-uppercase button-primary">uppercase</a>
  <a href="http://www.bootcss.com/" class="button button-lowercase button-primary ">lowercase</a>
  <a href="http://www.bootcss.com/" class="button button-capitalize button-primary">capitalize</a>
  <a href="http://www.bootcss.com/" class="button button-small-caps button-primary">small caps</a></div>

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

如需转载,请注明文章出处和来源网址:https://www.54u.net/490.html