发表于： 2016-10-01 19:07:17
2 639
今天完成的事情
看了《CSS 权威指南》中的块级元素/行内元素/盒子模型，对理论知识有大概的了解，其中一些概念还需要实战中消化理解，比如 line-heigt 这个属性就很值得研究；利用百分比设置元素的宽度实现九宫格布局。
明天计划的事情
尝试把代码布局到云服务器；尝试任务三
遇到的问题/收获：
修改边距为 0 后相邻的 img 元素四周仍然会有间隔，搜索了一下，解决办法就是想办法消除两个内联元素的默认间隙，比如 font-size:0;letter-spacing:-100px;另外慕课网张鑫旭 老师这个视频讲解的很清楚，主要就是匿名文本节点的原因。
消除图片底部间隙的方法:
- 图片块状化 - 无基线对齐 设置为 block 元素，这个任务中不合适。
- 图片底线对齐 - vertical-align:bottom;
- 行高足够小 - 基线位置上移 line-height:0;因为此任务中没有文字，因此可以用这个。
利用百分比设置元素的边距后发现在屏幕尺寸足够小的情况下会出现分布不均匀的情况，猜想是因为精度误差的原因，因此在利用 media 属性在屏幕尺寸较小的情况下增加外边距的百分比，解决了边距分布明显不均匀的情况。
参考 ngix 学习资源中知乎的回答资料后，更改默认主页后无法访问，纠结一翻后才发现文章最后面写了出错可以查看错误日志，一看才发现也是转义字符的原因，这里教训我看资料千万不能跳着看。
返回列表
评论