BootWiki教程网
源代码：
点击运行
<!DOCTYPE html> <html> <head> <meta content="width=device-width, initial-scale=1" name="viewport"> <link href="//cdn.staticfile.net/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css" rel="stylesheet"> <script src="//cdn.staticfile.net/jquery/1.10.2/jquery.min.js"></script> <script src="//cdn.staticfile.net/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> </head> <body> <div data-role="page"> <div class="ui-content" data-role="main"> <form action="demoform.asp" method="post"> <div class="ui-field-contain"> <label for="fname">名:</label> <input id="fname" name="fname" type="text"> <label for="lname">姓:</label> <input id="lname" name="lname" type="text"> </div> <input data-inline="true" type="submit" value="提交"> </form> <p> "ui-field-contain" 类 基于页面宽度来设置 label 和表单控件的样式。当页面宽度大于 480px 时，它会自动将 label 与表单控件放置于同一行。当小于 480px 时，label 会被放置于表单元素之上。</p> <p>请尝试调整窗口的尺寸来查看效果。</p> </div> </div> </body> </html>
运行结果