chrome像素尺子插件Page Ruler

Page Ruler插件是一款可以在你的chrome上增加一個(gè)尺子功能的插件，你可以通過(guò)這款插件測(cè)量網(wǎng)頁(yè)任意元素的尺寸。在Chrome中啟動(dòng)PageRuler插件可以與當(dāng)前網(wǎng)頁(yè)的屏幕無(wú)縫地集成到一起，可以使得用戶非常精確地測(cè)量出當(dāng)前頁(yè)面某個(gè)元素或者是整個(gè)頁(yè)面的大小尺寸。

插件介紹：

Page Ruler是一款可以測(cè)量Chrome瀏覽器中網(wǎng)頁(yè)元素大小尺寸的谷歌瀏覽器插件。頁(yè)面尺寸測(cè)量工具，前端設(shè)計(jì)師專用�？梢詼y(cè)量頁(yè)面元素、圖片和文本的尺寸、位置。Page Ruler是一款可以快速測(cè)量出當(dāng)前頁(yè)面中某個(gè)元素大小尺寸的Chrome插件，在Chrome中安裝了Page Ruler插件以后，可以點(diǎn)擊瀏覽器右上角的Page Ruler插件在任何頁(yè)面中啟動(dòng)它來(lái)測(cè)量相關(guān)的元素大小。

功能介紹：

*畫(huà)一把尺子到任何頁(yè)面，并查看寬度，高度和頂部，底部，左，右位置
*拖動(dòng)標(biāo)尺的邊緣來(lái)調(diào)整它的大小
*使用箭頭鍵移動(dòng)和調(diào)整標(biāo)尺的大小
*顯示從標(biāo)尺邊緣延伸的指南
*手動(dòng)更新標(biāo)尺的大小和位置，從工具欄上進(jìn)行精確的更改
*啟用“元素模式”來(lái)在頁(yè)面上的元素，當(dāng)你移動(dòng)你的鼠標(biāo)在他們
*通過(guò)任何被測(cè)元素的父母，孩子和兄弟姐妹

使用方法：

1.打開(kāi)一個(gè)待測(cè)網(wǎng)頁(yè)，選擇到將要測(cè)量的元素（或者是整個(gè)網(wǎng)頁(yè)）。

2.點(diǎn)擊Chrome右上角的Page Ruler插件來(lái)啟動(dòng)屏幕尺子的功能。2018-08-20

3.拖動(dòng)鼠標(biāo)畫(huà)出一個(gè)矩形來(lái)選中網(wǎng)頁(yè)中的待測(cè)元素（其中選中的部分會(huì)以陰影部分表現(xiàn)出來(lái)）。

4.通過(guò)屏幕上面的Page Ruler插件工具條來(lái)查看當(dāng)前選中的矩形大小的尺寸信息。

5.如果信息不符合要求，也可以選擇屏幕上面的間距輸入框來(lái)手動(dòng)微調(diào)選中元素的位置。

用戶在選擇Page Ruler插件進(jìn)行測(cè)量元素的時(shí)候，選中的元素會(huì)以一個(gè)陰影的形式存在于當(dāng)前的網(wǎng)頁(yè)中，其默認(rèn)的顏色是淡藍(lán)色，但是如果當(dāng)前網(wǎng)頁(yè)的顏色正好是淡藍(lán)色的話，那就很容易使用戶分不清到底選中來(lái)當(dāng)前頁(yè)面中的哪些區(qū)域，這時(shí)候就可以點(diǎn)擊Page Ruler插件上方工具欄的顏色按鈕來(lái)選擇一個(gè)更加鮮明的顏色當(dāng)作選中區(qū)域顏色的背景。