fe / yohobuy-frontend · Files

Go to a project
按钮.html 7.33 KB
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="http://static.yohobuy.com/admin/css/style.css" rel="stylesheet" type="text/css" media="all" />
<script type="text/javascript" src="http://static.yohobuy.com/admin/js/jquery.min.js"></script>
<link type="text/css" href="http://static.yohobuy.com/admin/js/jqueryui/themes/ui-lightness/jquery-ui-1.8.7.custom.css" rel="stylesheet" />
<script type="text/javascript" src="http://static.yohobuy.com/admin/js/jqueryui/ui/jquery-ui-1.8.7.custom.js"></script>
<title>YOHO有货后台管理</title>
</head>

<body>
<div class="mainbox">
  <div class="daohang">当前位置：<a href="main.html">首页</a> > <span>按钮</span></div>
  <button class="butok"></button>
  
  <button class="butcancal"></button>
  <br />
  <br />
  <button class="but1">添加备注</button>　<button class="but2" >查询</button>　<button class="but3" >删除</button>　<button class="but6" >四个字的</button>　<button class="but7" >四个字的</button>　<button type="button" class="butsearch" >查看</button> <button class="but_h" >灰色</button>
  <br />
  <br />
  <a class="but1" href="#" >添加备注</a>　<a class="but2" href="#" >查询</a>　<a class="but3" href="#" >删除</a>　<a class="but6" href="#" >四个字的</a>　<a class="but7" href="#" >四个字的</a>　<a class="butsearch" href="#" >查看</a>　<a class="but_h" href="#" >灰色</a>　<a class="but_hc" href="#" ><span>长长的灰色</span></a>　<a href="#" class="but4"><span>推荐到商城首页</span></a>　<a href="#" class="but5"><span>推荐到商城首页</span></a> <br />
  <br />
  <button type="button" class="searbut" ></button>
  <br />
  <br />
  <button type="button" class="buttonup" title="上移" ></button>
  
  <button type="button" class="buttondown" title="下移" ></button>
  
  <button class="buttonedit" title="编辑"></button>
  
  <button class="buttondamage" title="损"></button>
  
  <button class="buttonadd" title="加"></button>
  
  <button class="buttondel" title="减"></button>
  <br />
  <br />
  <a href="#" class="buttonup" title="上移" ></a>　<a href="#" class="buttondown" title="下移" ></a>　<a href="#" class="buttonedit" title="编辑" ></a>　<a href="#" class="buttondamage" title="损" ></a>　<a href="#" class="buttonadd" title="加" ></a>　<a href="#" class="buttondel" title="减" ></a>
  <br />
  <br />
  <div class="pagination"><a href="javascript:void(0);">共1111条数据</a><a href="javascript:void(0);">第10页/共100页</a><a title="第1页" href="#">&lt;&lt;</a><a title="上一页" href="#">上一页</a><a href="#" title="第1页">1</a><a href="#" class="act">2</a><a href="#" title="第3页">3</a><a href="#" title="第4页">4</a><a href="#" title="第5页">5</a><a href="#" title="第6页">6</a><a href="#" title="第7页">7</a><a href="#" title="第8页">8</a><a href="#" title="第9页">9</a>...<a href="#" title="第25页">25</a><a title="下一页" href="#">下一页</a><a title="第25页" href="#">&gt;&gt;</a></div>
  <br />
  <br />
  <table class="table1" style="width:100%;">
    <thead>
      <tr>
        <th>序号</th>
        <th>订单编号</th>
        <th>会员名</th>
        <th>收件人</th>
        <th>支付方式</th>
        <th>发货方式</th>
        <th>订单金额</th>
        <th>下单时间</th>
        <th>状态</th>
        <th>操作</th>
      </tr>
    </thead>
    <tr onmouseover="this.className='list-over';" onmouseout="this.className='';">
      <td>11</td>
      <td>23423234</td>
      <td>sandmax</td>
      <td>刘子阳</td>
      <td>货到付款</td>
      <td>送货</td>
      <td>800.00</td>
      <td>2010-10-10 10:00:25</td>
      <td><span class="font_red">等待确认</span></td>
      <td><button class="but2">查看</button></td>
    </tr>
    <tr class="F1" onmouseover="this.className='list-over';" onmouseout="this.className='F1';">
      <td>11</td>
      <td>23423234</td>
      <td>sandmax</td>
      <td>刘子阳</td>
      <td>货到付款</td>
      <td>送货</td>
      <td>800.00</td>
      <td>2010-10-10 10:00:25</td>
      <td><span class="font_green">已确认</span></td>
      <td><button class="but2">查看</button></td>
    </tr>
    <tr onmouseover="this.className='list-over';" onmouseout="this.className='';">
      <td>11</td>
      <td>23423234</td>
      <td>sandmax</td>
      <td>刘子阳</td>
      <td>货到付款</td>
      <td>送货</td>
      <td>800.00</td>
      <td>2010-10-10 10:00:25</td>
      <td>等待确认</td>
      <td><button class="but2">查看</button></td>
    </tr>
    <tr class="F1" onmouseover="this.className='list-over';" onmouseout="this.className='F1';">
      <td>11</td>
      <td>23423234</td>
      <td>sandmax</td>
      <td>刘子阳<span class="tips-right">正确提示!</span></td>
      <td>货到付款<span class="tips-error">错误提示!</span></td>
      <td>送货</td>
      <td>800.00</td>
      <td>2010-10-10 10:00:25</td>
      <td>等待确认</td>
      <td><button class="but2">查看</button></td>
    </tr>
  </table>
<br />
<br />
色块：<br />
<br />
<a href="#" class="color1"></a><a href="#" class="color2"></a><a href="#" class="color3"></a><a href="#" class="color4"></a><a href="#" class="color5"></a><a href="#" class="color6"></a><a href="#" class="color7"></a><a href="#" class="color8"></a><a href="#" class="color9"></a><a href="#" class="color10"></a><a href="#" class="color11"></a><a href="#" class="color12"></a><a href="#" class="color13"></a><a href="#" class="color14"></a><a href="#" class="color15"></a>

<br />
<br />
切换
<br />
<br />
<script language="javascript" type="text/javascript">			
			function showsub_b(id)
			{
				for (i = 0;i<2;i++)
				{
					document.getElementById("tab_b"+i).className = "";
					document.getElementById("sub_b"+i).style.display = "none";
				}
				document.getElementById("tab_b"+id).className = "act";
				document.getElementById("sub_b"+id).style.display = "";
			}
</script>
<div class="lan-tab">
    <ul>
     <li id="tab_b0" onclick="showsub_b(0)" class="act">最多六个字</li>
     <li id="tab_b1" onclick="showsub_b(1)">最多的六个字</li>
    </ul>
</div>

<div id="sub_b0">		
1
</div>
<div id="sub_b1" style="display:none">	
2
</div>

<br />
<br />

<button class="but1"  id="dialog_link">弹出窗口</button>

<script type="text/javascript">
			$(function(){
				// Dialog			
				$('#dialog').dialog({
					autoOpen: false,
					width:450,
                    height:260,
					modal: true,
					resizable: false
				});				
				// Dialog Link				
				$('#dialog_link').click(function(){
					$('#dialog').dialog('open');
					return false;
				});								
				
			});
			
				function opendialog(){
					$('#dialog').dialog('open');
					return false;
					
				}
</script>
<div id="dialog" title="弹出层" style="display:none;">
  <table class="tableout" cellspacing="5">
    <tr>
      <td>这里是内容</td>
    </tr>
    <tr>
      <td>
        <button type="button" class="butok" ></button>
        <button type="button" class="butcancal" ></button></td>
    </tr>
  </table>
</div>


<br />
<br />


<span class="tips-right">正确提示!</span>
<br />
<br />
<span class="tips-error">错误提示!</span>
<br />
<br />
<br />

</div>
</body>
</html>