<!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"> </script> <script> $(document).ready(function(){ }); </script> <style type="text/css"> .hr{ width: 225px; } .hr hr{ color: #dddddd; border: 4px solid; } .circle{ width: 30px;; } .circle div{ width:30px; height:30px; border-radius:25px; border: 6px #dddddd solid; } .circle span{ height:30px; line-height:30px; display:block; color:#000000; text-align:center; font-size:20px; } </style> </head> <body> <div style="background:#FFF;" > <h2 style="color:#9cacaf;margin:10px;"> 提现</h2><hr style="color: #ddeef2"> <br/> <table cellspacing="0px" width="100%"> <tr> <td class="hr"> </td> <td class="circle"> <div style="background-color:#8cc63f;"> <span style="color: white">1</span> </div> </td> <td class="hr"><hr></td> <td class="circle"> <div> <span>2</span> </div> </td> <td class="hr"><hr></td> <td class="circle"> <div> <span>3</span> </div> <td> <td class="hr"></td> </tr> <tr> <td class="hr"></td> <td colspan="2"> <span>填写提现金额</span> </td> <td colspan="2"> <span>确认提现信息</span> </td> <td colspan="2"> <span>提现结果</span> </td> </tr> </table> <br> <form method="post" name="theForm" action="{$action}" onsubmit="return validate()"> <table cellspacing="3px" cellpadding="3px" width="100%" style=" border-top: 10px solid #FFF;border-bottom: 10px solid #FFF;"> <tr> <td style="text-align:right;width: 210px;"> <span style="font-size: 16px;color:#929191">提现金额:</span> </td> <td> <input type="text" name="amount" style="width: 200px;height: 30px;" > <span style="font-size: 16px;color:#929191">元</span> <span style=‘color:red‘>*</span> </td> </tr> <tr> <td style="text-align:center;width: 130px;"> <td> <span style="font-size: 12px;color:#929191"> 提款到账时间:每天10:30前提款,估计到账时间11:30;每天16:00前提款,估计到账时间17:00。<br>(周末及法定节假日顺延,以具体到账时间为准)。 <br> </span> </td> </tr> <tr> <td colspan="2" style="text-align: center;"> <input type="hidden" value="{$step}" name="step"/> <input type="submit" class="cupid-blue" value="下一步"/> <input type="button" class="cupid-blue" value="上一步" onclick="history.go(-1);"/> </td> </tr> </table> </form> </div> </body> </html>
这是简化版的提现,主要是引导用户操作,这个图参考京东金融的提现。用最简单的html+css来实现的代码。没有用其他任何框架。
时间: 2024-10-16 04:53:22