From 310fd066e91f454b990372ffa30e803cc8120975 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 12:56:40 +0100 Subject: unslug zh-cn: move --- .../zh-cn/tools/page_inspector/3d_view/index.html | 102 --------------------- .../page_inspector/how_to/edit_fonts/index.html | 22 +++++ .../page_inspector/how_to/view_fonts/index.html | 22 ----- 3 files changed, 22 insertions(+), 124 deletions(-) delete mode 100644 files/zh-cn/tools/page_inspector/3d_view/index.html create mode 100644 files/zh-cn/tools/page_inspector/how_to/edit_fonts/index.html delete mode 100644 files/zh-cn/tools/page_inspector/how_to/view_fonts/index.html (limited to 'files/zh-cn/tools/page_inspector') diff --git a/files/zh-cn/tools/page_inspector/3d_view/index.html b/files/zh-cn/tools/page_inspector/3d_view/index.html deleted file mode 100644 index 60ea480269..0000000000 --- a/files/zh-cn/tools/page_inspector/3d_view/index.html +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: 三维视图 -slug: Tools/Page_Inspector/3D_view -translation_of: Tools/3D_View ---- -
{{ToolsSidebar}}
- -
-

三维视图在 Firefox 47 被移除。

-
- -

{{ fx_minversion_header("11") }}

- -

当你点击"三维视图"按钮之后,当前页面会进入三维视图模式,在该模式中, 页面中的HTML嵌套结构,会以图形化的方式,由外到内,从页面底部一级一级凸显出来. 这种视图可以让你很容易的看清楚页面的嵌套结构.

- -

3dview.png

- -

按住左键拖拽视图, 你可以旋转整个页面,从不同的角度查看页面的DOM层次,理清页面的结构. 页面显示区域以外的元素也变为可见状态,你能看到这些游离元素相对于页面可见区域所处的位置. 你可以点击区块选择对应的元素,该元素对应的HTML和CSS会在 HTML面板和Style面板显示出来.反回来, 你也可以在HTML面板中点击所要查看的元素,该元素也会在三维视图中成为被选择状态.

- -

如果你的页面查看器里没有三维视图按钮,则最有可能的原因是你的显卡驱动需要更新了. 查看blocklisted drivers page了解更多信息.

- -

控制三维视图

- -

通过键盘快捷键和鼠标操作可以控制三维视图的显示模式.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
功能键盘快捷键 鼠标操作
放大/缩小+/-             滚轮向上/向下滚动
向左/向右旋转a / d按住左键向左/向右拖动
向上/向下旋转w / s按住左键向上/向下拖动
向左/向右平移← / →按住右键向左/向右拖动
向上/向下平移↑ / ↓按住右键向上/向下拖动
重置放大级别到默认状态0无
将焦点转移到当前选择的节点,确保当前选择的节点是可见的{{ fx_minversion_inline("13.0") }}f无
重置整个视图到默认状态(放大级别,旋转角度,移动位置等){{ fx_minversion_inline("12.0") }}r无
隐藏当前选择的节点,确保当前选择的节点是不可见的, 这样可以看到下层被遮挡的节点{{ fx_minversion_inline("12.0") }}x无
- -

三维视图的用途

- -

三维视图在很多种情形下都会派上用场:

- - - -

相关链接

- - - -

{{ languages( { "ja": "ja/Tools/Page_Inspector/3D_view", "en": "en/Tools/Page_Inspector/3D_view"} ) }}

diff --git a/files/zh-cn/tools/page_inspector/how_to/edit_fonts/index.html b/files/zh-cn/tools/page_inspector/how_to/edit_fonts/index.html new file mode 100644 index 0000000000..a5a6ae1e6e --- /dev/null +++ b/files/zh-cn/tools/page_inspector/how_to/edit_fonts/index.html @@ -0,0 +1,22 @@ +--- +title: View fonts +slug: Tools/Page_Inspector/How_to/View_fonts +translation_of: Tools/Page_Inspector/How_to/Edit_fonts +--- +
{{ToolsSidebar}}

font-family tooltip 字体系列提示

+ +

当鼠标悬停在样式规则视图中的一个字体系列类型，将出现应用该字体类型的样例提示：

+ +

 

+ +

+ +

Fonts view 字体视图

+ +

Fonts view字体视图显示当前选中元素所应用的所有字体类型。需要注意的是，它显示的是浏览器当前系统使用的字体，这可能和CSS样式指定的字体不一样。

+ +

+ +

字体视图默认显示的文本是"Abc"，从Firefox 41开始，这个预览文本可以自由编辑。

+ +

 

diff --git a/files/zh-cn/tools/page_inspector/how_to/view_fonts/index.html b/files/zh-cn/tools/page_inspector/how_to/view_fonts/index.html deleted file mode 100644 index a5a6ae1e6e..0000000000 --- a/files/zh-cn/tools/page_inspector/how_to/view_fonts/index.html +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: View fonts -slug: Tools/Page_Inspector/How_to/View_fonts -translation_of: Tools/Page_Inspector/How_to/Edit_fonts ---- -
{{ToolsSidebar}}

font-family tooltip 字体系列提示

- -

当鼠标悬停在样式规则视图中的一个字体系列类型，将出现应用该字体类型的样例提示：

- -

 

- -

- -

Fonts view 字体视图

- -

Fonts view字体视图显示当前选中元素所应用的所有字体类型。需要注意的是，它显示的是浏览器当前系统使用的字体，这可能和CSS样式指定的字体不一样。

- -

- -

字体视图默认显示的文本是"Abc"，从Firefox 41开始，这个预览文本可以自由编辑。

- -

 

-- cgit v1.2.3-54-g00ecf