视口比例如何调整大小(视口比例如何调整)

3d max 如何设置视口布局？

3ds Max 默认采用 2 x 2 的视口布局。还可采用另外 13 种布局，但屏幕上视口的最大数保持 4 个不变。

使用“视口配置”对话框的 “布局”面板，可以从不同的布局中进行拾取，并在每个布局中自定义视口。

视口配置将与您的工作一同保存。

提示使用视口布局功能，您可以设置任意数量的自定义布局，通过单击鼠标即可在这些布局之间切换。

调整视口大小

在选择布局后，可以调整视口大小，通过移动分割视口的分隔条，使这些视口拥有不同的比例。

仅当显示多个视口时才可执行此操作。

调整大小后的视口

更改视图类型

当您工作时，可快速更改任一视口中的视图。例如，可以从前视图切换到后视图。

可以使用以下两种方法中的任意一种：菜单或键盘快捷键。

单击或右键单击要更改的视口的观察点 (POV) 视口标签。然后，从 POV 视口标签菜单单击希望采用的视图类型。

单击希望更改的视口，然后按下表中的某个键盘快捷键。

键视图类型

T	顶视图
B	底视图
F	前视图
L	左视图
C	摄影机视图。如果您所在的场景只有一台摄影机，或在使用该键盘快捷键前已选择摄影机 ，那么摄影机提供该视图。如果您所在的场景拥有多台摄影机，并且未选择任何摄影机， 屏幕将显示摄影机列表。
P	透视视图。保留前一视图的查看角度。
U	正交用户视图。保留前一视图的查看角度。允许使用 缩放区域 。
无	右视图。使用 POV 视口标签菜单。
无	图形视图。使用 POV 视口标签菜单。将视图与选定的图形范围和其局部 XY 轴自动对齐。

喜欢老师的教学风格，学习有收获请给予点赞，转发鼓励！

测绘CAD丨CAD如何调整布局中不同比例视口的图形线型比例？

点击上方【大水牛测绘】关注我们

在CAD软件中，系统默认状态下，无论是在图纸空间还是在不同比例的视口内绘制虚线图形，布局空间中同样比例相同线型的单元长度时一致的，如下图所示：

上图我们可以看到，上方两个红色圆形是同一个圆在两个比例不同视口中的显示效果，绿色圆形则是绘制在图纸空间中的，通过这四个圆形的比对，可以看到不同比例视口与图纸上绘制的线型单元是一样的。那么如果想要线型在不同比例视口中变得不一样，应该怎么办呢？

CAD中有一个系统变量——PSLTSCALE，它可以用来控制图纸空间线型比例，除了在命令栏中输入该命令外，也可以通过【线性管理器】对话框进行设置。

在CAD页面的线型下拉列表中点击【添加线型】打开线型管理器，【缩放时使用图纸空间单位】这一复选框就是用于控制PSLTSCALE变量的。

系统默认情况下，【缩放时使用图纸空间单位】是处于勾选状态，即PSLTSCALE为默认值1，此时视口内图形的线型比例会根据视口比例进行计算，使其与图纸空间线型比例保持一致；当取消这一复选框的勾选时，PSLTSCALE变量值将被设置为0，视口内图形的线型比例将不再考虑视口比例，不同比例视口的线型不一致，如下图所示：

以上就是布局中不同比例视口的图形线型比例调整的方法，大家可以自行根据需要来设置变量值。

前端基础：必须要知道的移动端适配（4）——视口

视口(viewport)代表当前可见的计算机图形区域。在Web浏览器术语中，通常与浏览器窗口相同，但不包括浏览器的UI， 菜单栏等——即指你正在浏览的文档的那一部分。

一般我们所说的视口共包括三种：布局视口、视觉视口和理想视口，它们在屏幕适配中起着非常重要的作用。

布局视口

布局视口(layout viewport)：当我们以百分比来指定一个元素的大小时，它的计算值是由这个元素的包含块计算而来的。当这个元素是最顶级的元素时，它就是基于布局视口来计算的。

所以，布局视口是网页布局的基准窗口，在PC浏览器上，布局视口就等于当前浏览器的窗口大小（不包括borders 、margins、滚动条）。

在移动端，布局视口被赋予一个默认值，大部分为980px，这保证PC的网页可以在手机浏览器上呈现，但是非常小，用户可以手动对网页进行放大。

我们可以通过调用document.documentElement.clientWidth / clientHeight来获取布局视口大小。

视觉视口

视觉视口(visual viewport)：用户通过屏幕真实看到的区域。

视觉视口默认等于当前浏览器的窗口大小（包括滚动条宽度）。

当用户对浏览器进行缩放时，不会改变布局视口的大小，所以页面布局是不变的，但是缩放会改变视觉视口的大小。

例如：用户将浏览器窗口放大了200%，这时浏览器窗口中的CSS像素会随着视觉视口的放大而放大，这时一个CSS像素会跨越更多的物理像素。

所以，布局视口会限制你的CSS布局而视觉视口决定用户具体能看到什么。

我们可以通过调用windownerWidth / innerHeight来获取视觉视口大小。

理想视口

布局视口在移动端展示的效果并不是一个理想的效果，所以理想视口(ideal viewport)就诞生了：网站页面在移动端展示的理想大小。

如上图，我们在描述设备独立像素时曾使用过这张图，在浏览器调试移动端时页面上给定的像素大小就是理想视口大小，它的单位正是设备独立像素。

上面在介绍CSS像素时曾经提到页面的缩放系数 = CSS像素 / 设备独立像素，实际上说页面的缩放系数 = 理想视口宽度 / 视觉视口宽度更为准确。

所以，当页面缩放比例为100%时，CSS像素 = 设备独立像素，理想视口 = 视觉视口。

我们可以通过调用screen.width / height来获取理想视口大小。

Meta viewport

<meta> 元素表示那些不能由其它HTML元相关元素之一表示的任何元数据信息，它可以告诉浏览器如何解析页面。

我们可以借助<meta>元素的viewport来帮助我们设置视口、缩放等，从而让移动端得到更好的展示效果。

<meta name=\"viewport\" content=\"width=device-width; initial-scale=1; maximum-scale=1; minimum-scale=1; user-scalable=no;\">

上面是viewport的一个配置，我们来看看它们的具体含义：

Value 可能值 描述 width 正整数或device-width 以pixels（像素）为单位， 定义布局视口的宽度。 height 正整数或device-height 以pixels（像素）为单位， 定义布局视口的高度。 initial-scale 0.0 - 10.0 定义页面初始缩放比率。 minimum-scale 0.0 - 10.0 定义缩放的最小值；必须小于或等于maximum-scale的值。 maximum-scale 0.0 - 10.0 定义缩放的最大值；必须大于或等于minimum-scale的值。 user-scalable 一个布尔值（yes或者no） 如果设置为 no，用户将不能放大或缩小网页。默认值为 yes。

移动端适配

为了在移动端让页面获得更好的显示效果，我们必须让布局视口、视觉视口都尽可能等于理想视口。

device-width就等于理想视口的宽度，所以设置width=device-width就相当于让布局视口等于理想视口。

由于initial-scale = 理想视口宽度 / 视觉视口宽度，所以我们设置initial-scale=1;就相当于让视觉视口等于理想视口。

这时，1个CSS像素就等于1个设备独立像素，而且我们也是基于理想视口来进行布局的，所以呈现出来的页面布局在各种设备上都能大致相似。

缩放

上面提到width可以决定布局视口的宽度，实际上它并不是布局视口的唯一决定性因素，设置initial-scale也有肯能影响到布局视口，因为布局视口宽度取的是width和视觉视口宽度的最大值。

例如：若手机的理想视口宽度为400px，设置width=device-width，initial-scale=2，此时视觉视口宽度 = 理想视口宽度 / initial-scale即200px，布局视口取两者最大值即device-width 400px。

若设置width=device-width，initial-scale=0.5，此时视觉视口宽度 = 理想视口宽度 / initial-scale即800px，布局视口取两者最大值即800px。

获取浏览器大小

浏览器为我们提供的获取窗口大小的API有很多，下面我们再来对比一下：

windownerHeight：获取浏览器视觉视口高度（包括垂直滚动条）。window.outerHeight：获取浏览器窗口外部的高度。表示整个浏览器窗口的高度，包括侧边栏、窗口镶边和调正窗口大小的边框。windowreen.Height：获取获屏幕取理想视口高度，这个数值是固定的，设备的分辨率/设备像素比windowreen.availHeight：浏览器窗口可用的高度。document.documentElement.clientHeight：获取浏览器布局视口高度，包括内边距，但不包括垂直滚动条、边框和外边距。document.documentElement.offsetHeight：包括内边距、滚动条、边框和外边距。document.documentElementrollHeight：在不使用滚动条的情况下适合视口中的所有内容所需的最小宽度。测量方式与clientHeight相同：它包含元素的内边距，但不包括边框，外边距或垂直滚动条。