Socket
Socket
Sign inDemoInstall

button

Package Overview
Dependencies
0
Maintainers
1
Versions
1
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

button

全站通用按钮组件。


Version published
Maintainers
1
Weekly downloads
470
decreased by-15.77%

Weekly downloads

Changelog

Source

1.1.1

tag:improved 优化了按钮按下的 active 效果,取消了 disable 按钮的按下效果。

Readme

Source

button


全站通用按钮组件,无图片纯 css 实现,IE8 以下无圆角。

可以很方便的和 alice.iconfont 配合使用。


a { color: #08c; } a:hover { color: #000; } a:active { color: #f60; }

演示

橙色按钮 a

<a href="javascript:;" class="ui-button ui-button-lorange">橙色大按钮</a>
<a href="javascript:;" class="ui-button ui-button-morange">橙色中按钮</a>
<a href="javascript:;" class="ui-button ui-button-sorange">橙色小按钮</a>

橙色按钮 input

<input type="button" class="ui-button ui-button-lorange" value="橙色大按钮">
<input type="button" class="ui-button ui-button-morange" value="橙色中按钮">
<input type="button" class="ui-button ui-button-sorange" value="橙色小按钮">

橙色按钮 button

<button class="ui-button ui-button-lorange">橙色大按钮</button>
<button class="ui-button ui-button-morange">橙色中按钮</button>
<button class="ui-button ui-button-sorange">橙色小按钮</button>

白色按钮 a

<a href="javascript:;" class="ui-button ui-button-lwhite">白色大按钮</a>
<a href="javascript:;" class="ui-button ui-button-mwhite">白色中按钮</a>
<a href="javascript:;" class="ui-button ui-button-swhite">白色小按钮</a>

白色按钮 input

<input type="button" class="ui-button ui-button-lwhite" value="白色大按钮">
<input type="button" class="ui-button ui-button-mwhite" value="白色中按钮">
<input type="button" class="ui-button ui-button-swhite" value="白色小按钮">

白色按钮 button

<button class="ui-button ui-button-lwhite">白色大按钮</button>
<button class="ui-button ui-button-mwhite">白色中按钮</button>
<button class="ui-button ui-button-swhite">白色小按钮</button>

不可用按钮 a

<a href="javascript:;" class="ui-button ui-button-ldisable">灰色大按钮</a>
<a href="javascript:;" class="ui-button ui-button-mdisable">灰色中按钮</a>
<a href="javascript:;" class="ui-button ui-button-sdisable">灰色小按钮</a>

不可用按钮 input

<input type="button" class="ui-button ui-button-ldisable" value="灰色大按钮">
<input type="button" class="ui-button ui-button-mdisable" value="灰色中按钮">
<input type="button" class="ui-button ui-button-sdisable" value="灰色小按钮">

不可用按钮 button

<button class="ui-button ui-button-ldisable">灰色大按钮</button>
<button class="ui-button ui-button-mdisable">灰色中按钮</button>
<button class="ui-button ui-button-sdisable">灰色小按钮</button>

蓝色按钮 a

<a href="javascript:;" class="ui-button ui-button-lblue">蓝色大按钮</a>
<a href="javascript:;" class="ui-button ui-button-mblue">蓝色中按钮</a>
<a href="javascript:;" class="ui-button ui-button-sblue">蓝色小按钮</a>

蓝色按钮 input

<input type="button" class="ui-button ui-button-lblue" value="蓝色大按钮">
<input type="button" class="ui-button ui-button-mblue" value="蓝色中按钮">
<input type="button" class="ui-button ui-button-sblue" value="蓝色小按钮">

蓝色按钮 button

<button class="ui-button ui-button-lblue">蓝色大按钮</button>
<button class="ui-button ui-button-mblue">蓝色中按钮</button>
<button class="ui-button ui-button-sblue">蓝色小按钮</button>

Keywords

FAQs

Last updated on 27 Jun 2013

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc