1 环境搭建:
jdk配置+eclipse下载
请参考:/ForestDeer/p/6647402.html
2测试页面快速开发技巧
/try/bootstrap/layoutit/
第一步:删除右侧内容,只留下Container
布局设置:可以选择其中的任意一个布局,点击拖动到右侧, 右侧会生成 Row-Coumn。
根据页面需要我们可以选择不同的格局 ,我们一12布局为例:
第二步:
基本css选择:
这里我们选择提交表单,因为测试页面往往是往后面提交一下测试数据。表单比较是我们测试使用
点击下载,就可以看到页面代码。
直接复制下来。
打开eclipse,新建一个项目
选择web项目
<div class="container"><div class="row clearfix"><div class="col-md-12 column"><form role="form"><div class="form-group"><label for="exampleInputEmail1">Email address</label><input type="email" class="form-control" id="exampleInputEmail1" /></div><div class="form-group"><label for="exampleInputPassword1">Password</label><input type="password" class="form-control" id="exampleInputPassword1" /></div><div class="form-group"><label for="exampleInputFile">File input</label><input type="file" id="exampleInputFile" /><p class="help-block">Example block-level help text here.</p></div><div class="checkbox"><label><input type="checkbox" />Check me out</label></div> <button type="submit" class="btn btn-default">Submit</button></form></div></div></div>
在head标签中加入<link rel="stylesheet" href="http://cdn./libs/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="http://cdn./libs/jquery/2.1.1/jquery.min.js"></script><script src="http://cdn./libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
再次刷新页面就可以得到如下内容:
如果觉得《测试学开发——第一课:环境搭建与页面开发介绍。》对你有帮助,请点赞、收藏,并留下你的观点哦!