【总结】2016.12.21-2016.12.22

计划的任务

1. 黑xx 页面与交互KO

实际完成

1. 黑xx 模板与接口修正
2. 黑xx 播放
3. 黑xx 支付
4. 黑xx 自测与修改小问题

总结

• 基本上页面都完成了，测试过两遍。
• input 当为button的时候，value“加载更多”文字没有居中。找了下解决，align:middle只是配合图片素材时使用的。错误原因是之前用div做的，单行盒布局的属性没有删除，当改为用input的时候还残留了一些class，这些class使得input的样式在IOS下变了样（奇怪，在安卓上没问题），后来用非常纯净的<input type="button" value="加载更多"/>标签再加点样式，就是默认居中的。当时为什么由div改用了input呢？是因为防止用户多次点击“加载更多”，在一次点击后，我先把input 的值设为disabled，再去请求数据，完成了再设置disabled为false。利用这个来进行控制,但是没有把弹性盒布局的属性拿掉。
• 滚动条。一个div的若设置overflow:scroll，在页面内容比较少（不足以使用滚动）的情况下，在安卓机上还是会有滚动条的存在。而设置为overflow:auto;则内容少时无滚动条，多时才会出现。算比较人性化的...原来滚动条可以设置样式的，用::-webkit-scrollbar属性。
• float。对浮动似乎还不太理解。用的是 float:left; ,可是最后一个C#标签问什么会在一行的最右呢？ 173076220036507694.jpg 原来是float浮动会选择卡位式的占据。我的理解就是在高度上，只要有一点的空隙，div就不会出现在下一行而是出现在高度相对较小的地方。
  Paste_Image.png 有了这个前提，在看看为什么最后一个C#标签。把标签都弄成矩形再出去边际，会看得清楚一点。明显 C# 后面的 asp 似乎高度没有旁边的 java后台开发 的标签高。用chrome鼠标选择看到，确实高度不一样。原来是中英文字体高度不同。在div随字体宽高自由撑起的情况下，div都是不同高度的。 725992038229290051.jpg 只要把高度定好，就不会出现这种问题了。另外还可以用弹性盒布局+换行来处理这些标签。
  Paste_Image.png