alice-button-dropdown

1.4.0 • Public • Published

ButtonDropdown


按钮下拉菜单样式。


演示

<a class="ui-button ui-button-lorange ui-dbutton ui-dbutton-orange">
    <span class="ui-dbutton-self">下拉菜单</span>
    <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
</a>
<a class="ui-button ui-button-morange ui-dbutton ui-dbutton-orange">
    <span class="ui-dbutton-self">下拉菜单</span>
    <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
</a>
<a class="ui-button ui-button-sorange ui-dbutton ui-dbutton-orange">
    <span class="ui-dbutton-self">下拉菜单</span>
    <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
</a>
<a class="ui-button ui-button-lwhite ui-dbutton ui-dbutton-white">
    <span class="ui-dbutton-self">下拉菜单</span>
    <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
</a>
<a class="ui-button ui-button-mwhite ui-dbutton ui-dbutton-white">
    <span class="ui-dbutton-self">下拉菜单</span>
    <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
</a>
<a class="ui-button ui-button-swhite ui-dbutton ui-dbutton-white">
    <span class="ui-dbutton-self">下拉菜单</span>
    <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
</a>
<div class="ui-button-dropdown">
    <a class="ui-button ui-button-lorange ui-dbutton ui-dbutton-orange">
        <span class="ui-dbutton-self">下拉菜单</span>
        <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
    </a>
    <ul class="ui-button-dropdown-large">
        <li class="ui-button-dropdown-item">
            <a href="#">设置代扣</a>
        </li>
        <li class="ui-button-dropdown-item">
            <a href="#">标为已缴</a>
        </li>   
    </ul>
</div>
 
<div class="ui-button-dropdown">
    <a class="ui-button ui-button-morange ui-dbutton ui-dbutton-orange">
        <span class="ui-dbutton-self">下拉菜单</span>
        <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
    </a>
    <ul class="ui-button-dropdown-middle">
        <li class="ui-button-dropdown-item">
            <a href="#">设置代扣</a>
        </li>
        <li class="ui-button-dropdown-item">
            <a href="#">标为已缴</a>
        </li>   
    </ul>
</div>
 
<div class="ui-button-dropdown">
    <a class="ui-button ui-button-sorange ui-dbutton ui-dbutton-orange">
        <span class="ui-dbutton-self">下拉菜单</span>
        <i class="ui-dbutton-arrow iconfont" title="下三角形">&#xF03C;</i>
    </a>
    <ul class="ui-button-dropdown-small">
        <li class="ui-button-dropdown-item">
            <a href="#">设置代扣</a>
        </li>
        <li class="ui-button-dropdown-item">
            <a href="#">标为已缴</a>
        </li>   
    </ul>
</div>

Readme

Keywords

Package Sidebar

Install

npm i alice-button-dropdown

Weekly Downloads

1

Version

1.4.0

License

MIT

Last publish

Collaborators

  • jaredleechn
  • pigcan