一个热爱网络的年轻人的博客
作为一个对代码负责的人，每次看见别人代码里混乱的命名，总是不禁心里一顿暗骂。问及写代码的人，他们的回答总是：我英文不好，不知道如何取名，都想破了脑袋。而一些QQ群里提问题的朋友截图代码，命名也是非常混乱。网上有很多人发表CSS常用命名的文章，也都挺好的，我只是一个收集者，和把自己的常用命名加上去，分享给有需要的人，希望大家以后写的代码自己看着舒服，别人维护着也舒服。
第一次听说CSS Scroll Snap Points的时候，是在微博里看到的一个gif图，当时看到后，瞬间感觉CSS惊为天人啊！以前这种轮播必须要用js来写的，现在居然CSS都可以实现！立马搜了下相关代码，写了个demo，发现只有最新版火狐支持，为此还把火狐给更新了一下。
CSS布局中外边距margin和内边距padding应该是经常用到的属性，不过值除了正数和负数，百分比也是个很有用的。下面就简单介绍margin、padding百分比的情况和使用场景。
首选提一个简单的问题，外层灰色div宽1000px，高500px，里面的黑色div，margin:10%，请问黑色div的margin值是多少？
移动端里对悬浮效果支持不是很好。例如PC端里很常见的页面滚动到一定距离，导航悬浮效果，页面scroll的时候计算滚动条和顶部距离，加fixed就可以了。但移动端里，基本上所有手机，页面滚动的时候，任何js都不会执行。所以手机里这个效果，得等到页面停止滚动，导航才会悬浮。
网页布局里很多地方需要宽高等比缩放功能，例如手机网页的全屏轮播。轮播的宽度随着手机不同分辨率而变化，高度自适应，这样才不会让轮播里面的图片压缩变形，顶多就是放太大而变模糊。
请允许我一上来就泼盆冷水。不知道是谁说的：搞移动端吧，移动端是webkit的天下，没有IE6，兼容性简单多了。话虽这样说，但未免太乐观了。我Android的UC浏览器到现在，怎么清除缓存，有个页面的某部分始终没有样式加载，我都想卸载了。。。很少人兼容Windows Phone，我一直在做兼容，也是一堆坑。手机端依旧有兼容性，只是一般不会去写hack而已。
由于宽带问题，家里多人使用网络的时候，打开网站加载网页就不那么快了。网速慢的时候按钮这里的图片加载需要一段时间，如图，很不美观。那么是否有办法优化图片加载慢或者未加载成功时候的方案呢？有！
话说那天同事的项目里箭头bug，不小心被leader看到了，然后追溯根源的时候，是copy我做的代码（满头黑线）。我检查了下我的项目，基本上所有箭头都沦陷了。因为实现箭头，我喜欢用空标签border的写法，同事喜欢切图，各有各的好吧。
大型网站的首页加载速度是每个公司都非常重视的，而且还会列举各大同行的网站首页加载速度数据，来进一步提升自己网站的指标。网站加速无非那几点：服务器端的CDN、Gzip，后台的缓存、静态化，前端的CSS、js合并、减少http请求、DOM优化、懒加载等。本文讲的另外一个，背景图片的优化建议。
前几天一朋友在群里问clear:left的意思，我以为是简单的清除浮动问题，就让他百度“清除浮动”，导致中间有点小误会。后来我按照他写的DEMO，发现我自己也没完全理解clear:left和clear:right的意思。特别看了下手册，和写了几个DEMO，经过群里其他人指导，总结如下，希望对其他人能有点帮助。