Firefox前端开发像素测量插件——MesureIt

现在，前端开发是一份非常流行的网页开发类型的工作，但这份工作很不容易做，你必须有丰富的网页开发经验，非常了解http传输协议，又要会编写性能良好的javascript，另外，还要可能还非常配合平面设计师设计出CSS/Div的网页模板！开发人员需要严格按照平面设计师的要求用CSS来精确控制Div的大小与及边距(margin或padding),由于受到line-height的影响，有些文字与周围的元素有位置还有一微小的差别，用肉眼是很不容易看出来，这时我们需要用到一个像素测量工具！最好是浏览器插件，这里我们推荐Firefox插件——MesureIt：

 

如图所示，打开插件开关后，用鼠标在文字和旁边的图形元素之间画出一个矩形（用浏览器里的缩放功能放大到最大，这时误差最小！），这里我们可以比较精确地测量出文字和旁边的图形元素之间的距离：20px。瞧，这样，用这个工具测量后，再调整一个CSS，就不用再担心做出来的网页不符合设计师的要求了！

注：安装好插件后，可能仍然看不到该插件，如上图的尺子样式的图标。我们需要打开下拉菜单View,选择toolbar后，再点击customize,从面板中选中尺子图标，再将其拖到工具栏上的某一位置，如上图，我放在地址栏的右边。