1. 基础外观

    <div class="c_tab">
    	<ul>
    		<li><a href="#nogo">产品变更</a></li>
    	</ul>
    </div>
    
  2. 扩展外观

    1. 不自动换行

      1. 设置前

      2. 设置后

        <div class="c_tab c_tab-nowrap">
        	<ul>
        		<li><a href="#nogo">用户基本信息</a></li>
        	</ul>
        </div>
        
    2. 操作按钮

      1. 自动换行状态时

        <div class="c_tab">
        	<div class="op">
        		<a href="#nogo" class="pre" title="前移"></a>
        		<a href="#nogo" class="next" title="后移"></a>
        		<a href="#nogo" class="all" title="显示全部"></a>
        		<a href="#nogo" class="unfold" title="折叠"></a>
        	</div>
        	<div class="tab">
        		<ul>
        			<li><a href="#nogo">用户基本信息</a></li>
        		</ul>
        	</div>
        </div>
        

        此时仅显示“折叠”的按钮,用于自动换行状态和不自动换行状态的切换。

      2. 不自动换行状态时

        <div class="c_tab c_tab-nowrap">
        	<div class="op">
        		<a href="#nogo" class="pre" title="前移"></a>
        		<a href="#nogo" class="next" title="后移"></a>
        		<a href="#nogo" class="all" title="显示全部"></a>
        		<a href="#nogo" class="unfold" title="折叠"></a>
        	</div>
        	<div class="tab">
        		<ul>
        			<li><a href="#nogo">用户基本信息</a></li>
        		</ul>
        	</div>
        </div>
        

        此时显示“前移”、“后移”、“显示全部”三个按钮,用于控制 tab 项。

    3. 功能区域

      <div class="c_tab">
      	<div class="fn">
      		<button type="button"><i class="e_ico-delete"></i><span>删除</span></button>
      		<button type="button" class="l_ml"><i class="e_ico-add"></i><span>新增</span></button>
      	</div>
      	<div class="tab">
      		<ul>
      			<li><a href="#nogo">产品变更</a></li>
      		</ul>
      	</div>
      </div>
      
    4. 当前项设置

      <div class="c_tab">
      	<ul>
      		<li class="on"><a href="#nogo">产品变更</a></li>
      		<li><a href="#nogo">惠农网业务</a></li>
      	</ul>
      </div>
      
    5. 次级分页标签

      <div class="c_tab c_tab-2">
      	<ul>
      		<li><a href="#nogo">惠农网业务</a></li>
      	</ul>
      </div>
      
    6. 三级分页标签

      <div class="c_tab c_tab-3">
      	<ul>
      		<li><a href="#nogo">惠农网业务</a></li>
      	</ul>
      </div>