Page Ruler頁面測量尺子(V2.1.3) - Chrome插件(谷歌瀏覽器插件)

Page Ruler(V2.1.3) Chrome插件開發背景

Page Ruler頁面測量尺子(V2.1.3)的背景我們就不多做介紹了，其實跟Page Ruler插件是一樣的。不僅僅可以測量元素的寬度和高度，同時可以測出元素所相對于頁面的絕對位置，對于前端狗們來說，這應該算是個比較不錯和好用的測量用插件了。

頁面標尺可讓您將標尺繪制到任何頁面并顯示其寬度，高度和位置。
特征
-------------
*繪制標尺到任何頁面，并查看寬度，高度以及頂部，底部，左側和右側的位置
*拖動標尺的邊緣來調整它的大小
*使用箭頭鍵移動和調整標尺尺寸
*顯示從標尺邊緣延伸的指南
*從工具欄手動更新標尺的大小和位置以進行精確更改
*將鼠標移動到頁面上時，啟用“元素模式”以勾勒頁面上的元素
*瀏覽任何測量元素的父母，孩子和兄弟元素

Page Ruler(V2.1.3) Chrome插件使用方法

個人覺得Page Ruler頁面測量尺子(V2.1.3)的使用方法也不用多做介紹了，了解Page Ruler插件的朋友自然是熟悉的。

1.拖動鼠標畫出一個矩形來選中網頁中的待測元素（其中選中的部分會以陰影部分表現出來）。
Page Ruler圖片
2.通過屏幕上面的Page Ruler插件工具條來查看當前選中的矩形大小的尺寸信息。

3.如果信息不符合要求,也可以選擇屏幕上面的間距輸入框來手動微調選中元素的位置。

4.在啟動Page Ruler插件以后,用戶會看到當前的網頁屏幕中會出現幾個細線,其中陰影部分就是被Page Ruler插件選中的測量部分,在Page Ruler插件的右上角或顯示該插件的測量的詳細結果,用戶也可以通過拖動這些細線來調整待測區域的大小,或者是拖動陰影區域來選擇不同的測量元素。