前几天改公司官网，领导扔给我个烂摊子。原先那网页简直像用脚写的，按钮点不动，手机上看文字挤成一团。我对着屏幕发愁，以前学html那套早忘光了。
重新上路的过程
翻出三年前买的教程书，硬着头皮开干。先拿记事本瞎写：
- 标题标签套正文
- 导航栏拿空格瞎凑
- 图片尺寸直接拖浏览器调
弄了三小时，网页在手机上看还是乱七八糟。气得我差点把键盘摔了，这不白折腾吗？
撞出来的窍门
蹲厕所刷教程时突然开窍：网页得当拼图玩！先用纸画出区块：
- 头部的标题栏
- 中间的内容罐子
- 底部的联系方式
打开编辑器重新搞：
- 每个区域用div圈地盘
- 标题文字拿h系列标签框住
- 导航菜单改用ul小清单
就这么简单分个区，电脑上看突然有模有样了！
手机屏的魔法
最头疼的手机适配，就两招：
- 所有尺寸改成%百分比
- 图片加上max-width:100%
加完这段咒语：
- 图片自己会缩
- 文字自动换行
- 按钮不再跑出屏幕
手机上看居然清爽了，省了原来一半时间！
血泪换的实战经
这三点帮我少掉头发：
- 每写5行就刷新看效果，别堆到改
- 乱套就清空重划区块，比硬修快三倍
- 手机测试用浏览器缩放，不用真开手机
原先三天的工作，按这法子六个钟头搞定了。交差时领导眼珠子都要瞪出来——他大概以为我要磨叽一礼拜！
