Buttons——CSS按钮样式库

点击进入查看官网说明

不同颜色按钮：

    <button class="button button-3d button-primary">button1</button><button class="button button-3d button-action">button2</button><button class="button button-3d button-caution">button3</button><button class="button button-3d button-royal">button4</button><button class="button button-3d button-inverse">button5</button><button class="button button-3d button-highlight">button6</button><button class="button button-3d">button7</button>

按钮组：

    <div class="button-group"><button class="button button-raised button-primary">button1</button><button class="button button-raised button-action">button2</button><button class="button button-raised button-caution">button3</button><button class="button button-raised button-royal">button4</button><button class="button button-raised button-inverse">button5</button><button class="button button-raised button-highlight">button6</button><button class="button button-raised">button7</button></div>

按钮大小：

    <div><button class="button button-tiny button-primary">button1</button><button class="button button-small button-primary">button2</button><button class="button button-primary">button3</button><button class="button button-large button-primary">button4</button><button class="button button-jumbo button-primary">button5</button></div>

按钮形状：

    <div><span class="button-wrap"><button class="button button-circle"></button></span><span class="button-wrap"><button class="button button-circle button-raised button-primary"></button></span><span class="button-wrap"><button class="button button-pill"></button></span><span class="button-wrap"><button class="button button-pill button-raised button-primary"></button></span></div>

堆叠按钮：

    <div><a href="javascript:;" class="button button-block button-rounded button-large">GO</a><a href="javascript:;" class="button button-block button-rounded button-primary button-large">GO</a><a href="javascript:;" class="button button-block button-rounded button-action button-large">GO</a><a href="javascript:;" class="button button-block button-rounded button-caution button-large">GO</a><a href="javascript:;" class="button button-block button-rounded button-royal button-large">GO</a><a href="javascript:;" class="button button-block button-rounded button-inverse button-large">GO</a><a href="javascript:;" class="button button-block button-rounded button-highlight button-large">GO</a></div>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/548464.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！