智能滑块“设置：尺寸本文解释了“”。Pro版我们还解释了该产品的功能，因此它旨在对已经是Pro用户或即将开始使用Pro版本的人有益。
该描述还旨在帮助免费版本的用户加深他们对基本操作的理解，我认为“ Pro版本升级可以实现的内容”的形象也将很明显。
我们建议您从计算机屏幕上查看这篇文章。
滑块设置（大小）
在滑块设置中，单击尺寸我们将为此解释。
滑块大小
设置滑块尺寸时，将宽度和高度设置为滑块的标准。与其设置确切的宽度和高度，不如使用滑块的“也很重要”纵横比这是设置的图像”。
另外，滑块类型盒子』『完整的宽度』『全画面设置因设置而有所不同，因此我们将详细解释它们。
隐藏
根据您的查看设备，可以隐藏滑块。
例如，智能手机图标如下：在如果设置它，则只有在显示智能手机时才隐藏滑块。
如果您使用带有大量信息（例如文本或按钮）的滑块，则可能无法在小型智能手机屏幕上显示所有信息。即使它的滑块垂直太长，它也会看起来很丑。在这种情况下，如有必要隐藏您可以使用它隐藏它。
滑动宽度极限
“幻灯片宽度限制”是默认在现在。该效果将应用于“宽度和高度”中设置的数字。
您还可以为每个设备设置一个宽度限制，例如“桌面”，“平板电脑”和“移动”（见下文）。
首先，查看下面的简短视频以获得基本的理解。
幻灯片的背景图像设置为根据浏览器宽度的变化自动扩大和收缩。
我认为这不是问题，但是当您考虑一下时，可能会带来不便。
如果是“全宽滑块”扩展浏览器的全部宽度，浏览器宽度越大，滑块就越高。
因此，一旦浏览器宽度高于一定级别，您将需要固定幻灯片高度（保持相同的高度）。这是“幻灯片宽度极限”的作用。
但是，仅此一项就使很难想象。
『盒子』『完整的宽度』『全画面我们将以每种布局类型为例详细说明“大小设置”和“幻灯片宽度限制”之间的关系。
尺寸设置：盒装
『盒子布局是一个适合页面“内容宽度”的滑块。
内容宽度（=内容显示区域）是各自的内容宽度。WordPress它因主题而异。如果您有一个没有侧边栏的“单列”页面，例如此页面，则将显示更大的内容，如下所示。
幻灯片2
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
幻灯片3
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
幻灯片1
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
此页面上的“内容宽度”是1136px是。我想将滑块尺寸的宽度设置为比内容宽度稍宽，因此我想将滑块尺寸的宽度设置为“大小”1200px'。
“高度”受滑块上“文本”和“按钮”之类的音量的影响。将其设置为足够高。在这里，我们将介绍”600px它设置为'。
和”盒子在布局中，通常建议使用与滑块大小相同的纵横比和高度相同的图像。该滑块用于背景的图像是“宽度”1200px，高度600px“是。
但是，即使您说“使用具有相同纵横比的图像”，也无需在“滑块大小”中设置宽度和高度，而背景图像的大小完全相同。
例如 ”1200 x 600'， 不是 '1400 x 700』『1600 x 800使用图像是可以的。“显示的结果完全相同。
紧凑的展示案例
『盒子布局并不总是显示完整的内容宽度。您可能需要以这样的紧凑方式显示它：
幻灯片2
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
幻灯片3
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
幻灯片1
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
在这种情况下，设置要显示的滑块的确切大小。
正如我稍后将要解释的那样，如果您有点倒下，布局有一个称为“高档关 '。
要在页面中心显示滑块，请单击“常规设置”>滑块设计'→对齐，选择中心。
『盒子在“大小”设置大小时，请确保了解滑块的宽度不会比内容宽度宽。
尺寸设置：完整宽度
在布局中，完整的宽度（（完整的宽度）如果选择”，则背景图像将以浏览器的完整宽度显示。
幻灯片1
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
幻灯片2
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
幻灯片3
Lorem非常胡萝卜，氢本科开发人员。茉莉花便利需要痛苦。阿尼亚弥撒。当拉...
上面的滑块包括以下内容：1920 x 600px设置“设置”的水平背景图像。
『完整的宽度'滑块背景图像的建议图像大小是宽度。1920px是。
在这里，假设“滑块大小”的值是“宽度”1200px，高度600px'。
对于背景图像，以下框架包围的区域是宽度1200px，高度600px“是。
基本上，即使您更改浏览器的宽度，图像也会在维护此纵横比的同时放大和输出。但是，随着图像的扩大，图像变得过高是一个问题。
因此，可以“当浏览器宽度高于一定级别时，可以扩展宽度，而不会更改高度并显示。”
限制幻灯片宽度
宽度和高度滑动宽度极限有一个称为“。”的开关在现在。
『滑动宽度极限“但在如果设置了此滑块，则浏览器的宽度为1200px如果超过高度，高度为600px它将按原样固定。
但是，浏览器的宽度将更宽，因此将显示左右的隐藏零件，并且只会扩展宽度显示区域。
由于上述原因，当使用全宽滑块时，基本方法是使用水平背景图像，并使用滑动宽度极限。在最好把它作为。
尺寸设置：全屏（全页）
全画面 (完整页）滑块允许您使整个页面成为滑块区域。
全屏滑块的示例：这里
上面的全屏幕滑块的示例使用以下背景图像：
『全画面在布局中，背景图像涵盖了整个页面，因此所使用的图像不仅是“宽度”，而且还足够高度'也是必要的。
基本上，宽度1920px，高度1080px建议使用“背景图像”。
『全画面在布局的情况下，无需如此紧密地考虑“滑块大小”设置，但是基于桌面上的显示，它是”1200 x 700如果您将其放在一个水平上，那很好。
滑动宽度极限
『滑动宽度极限关于 ''，完整的宽度我已经在滑块的“大小设置”部分中提到了它。
我们解释说：“为防止浏览器宽度较宽时滑块过高，我们可以在达到一定宽度时固定高度。”
我认为这主要是主要用途。
如果是“盒装”
『盒子''，滑块的宽度不会比内容宽度宽，因此几乎不必担心滑块太高。
如果是“全屏”
『全画面'，由于滑块高度=浏览器高度，因此几乎不需要意识到固定高度。
“幻灯片宽度极限”的其他用途
『滑动宽度极限也可以为每个设备显示单独设置。
示例输入
设置时，幻灯高度在以下范围内固定：
| 移动的 | 〜700（900）Px |
| 药片 | 701（901）〜1199 PX |
| 桌面 | 1200 PX |
但是，控制您想要的方式起初可能有些困难。选择背景图像的大小也会影响显示。它也是使用后您只需要习惯的一部分即可。
用于旋转木马
顺便一提”轮播』『展示柜对于类型的滑块滑块大小'，加上'幻灯片大小'将添加设置。
『轮播“如果是
『展示柜“如果是
『幻灯片大小'意味着以下内容：
滑动
这意味着指定每个幻灯片的宽度和高度，而不是滑块区域。
『最大窗格宽度“和”滑动距离以下是关于“。
滑动
『最大窗格宽度''允许您控制可以随时显示的幻灯片数量。
『滑动距离'指定每个载玻片之间的距离（分裂距离）。
断点
网页是手机或者药片，个人电脑它可能出现在任何设备上，包括浏览器。您可以根据浏览器的宽度更改显示屏和布局。响应式设计``''说。
『断点'定义浏览器显示的宽度是在更改不同设备之间的布局时。默认情况下，以下是700px』『1199px它设置在两个地方：'。
您可以自由地更改断点的价值，但是只要没有问题，就可以按原样离开此设置是可以的。
“侧身”是指将智能手机或平板电脑设置在侧面时的数值设置。
断点是700px』『1199px由于它位于两个位置，”布局显示将以以下三个宽度级别切换。
| 移动的 | 〜700（900）Px |
| 药片 | 701（901）〜1199 PX |
| 桌面 | 1200 PX |
但是，即使您使用一台智能手机，屏幕尺寸也从小到大。为了提供更多详细信息，也可以将断点添加到以下三个位置（Pro）。
另外，即使已更改了断点值，全局断点您可以通过打开来切换到默认设置。
布局
『布局''，选择布局类型。 “盒子』『完整的宽度』『全画面'，显示的设置将有所不同。让我们顺序看看。
如果是“盒装”
降低/高档
『盒子“如果是，”降低」「高档“从一开始在现在。
降低：
宽度比滑块大小设置的“宽度，高度”窄，或手机当滑块显示在小屏幕上时减小尺寸它将调整它。
高档：
即使图像的纵横比不相同，防止缝隙向上，向下，左右尺寸扩张并调整它（而不是使用图像上下或者左右将修剪）。
『降低我认为不会将其关闭。
『盒子如果您不想显示类型的滑块“，请单击”高档确保关闭以下内容。
最小高度
『最小高度“允许您将最小的“高度”设置为滑块。例如， ”400px如果您键入”，即使浏览器宽度较窄，高度也不会低于400px。
在这种情况下，浏览器宽度越近，而不是保持“高度”级别，将滑块越垂直显示，因此背景图像的左和右侧将被裁剪。
在“全宽”的情况下
强制宽度
对于“完整宽度”布局，默认为“”强制宽度'已打开，滑块将以浏览器的完整宽度显示。
反之亦然”强制宽度如果关闭，滑块显示屏将在内容宽度范围内。例如，显示侧边栏2列页面在这种情况下，将其关闭是一个好主意。
溢出-x
为防止垂直滚动条出现在某些动画中的滑块中，请使用该网站的身体或者html该标签指定为“ Overflow-X：隐藏”。
简而言之，当显示垂直滚动条时，它看起来不可接近，因此将其隐藏起来。基本上，这里无需在这里更改任何内容。
将滑块宽度调整为
我刚刚解释了如下的“全宽”滑块的显示。
- “强迫全宽度”在→显示浏览器的完整宽度
- “强迫全宽度”离开→显示完整的内容宽度
现在，如下，”主要的'，如果您想将滑块宽度与之匹配，该怎么办？
在这种情况下，将滑块宽度调整为'，指定将为滑块的父的元素（例如选择器名称）。现在，将滑块宽度设置为“主要的它可以根据'的宽度显示。
在某种程度上，html/CSS基础知识，例如：另外，您的使用WordPress元素（选择器名称）因主题而异。
如果是“全屏”
约束比
『约束比'是默认离开基本上可以删除它。
在如果你说”滑动画布（包含文本和按钮之类的层的区域）将尽可能地维持“滑块尺寸”中设置的长宽比。
例如，假设您有一个类似的“全屏页面”：在桌面视图中，有很多宽度，滑块上的图层显示在左右块中（粉红色框架）。
当您将其视为移动设备时，看起来像这样：通过在垂直行中显示两个行的层块，它支持垂直智能手机显示屏。
左边是”约束比'不在。右侧打开。
『约束比'不在
『约束比'
左边是约束比如果“关闭，则层内有适中的边距，使其易于阅读。
另一方面，右边约束比如果您使用的是”，则内容被迫维持水平比，并且内容位于中间。因此，用法是根据具体情况的，包括显示方式。
基于高度
在智能手机视图中，在页面的顶部或底部，URL栏您会看到这样的东西（滚动时会隐藏的东西）。
这URL栏如果要确定滑块的高度，请考虑显示区域，例如：真正的高度'。
『真正的高度』
『CSS 100VH』
反之亦然，URL栏如果您想在屏幕的完整高度上显示而不考虑显示区域，例如：CSS 100VH'。
降低高度
根据网站的不同，页面底部移动菜单，或者弹出窗口有时可能会显示该消息。
为了防止内容隐藏在此类菜单和弹出窗口中，请单击降低高度'可以指定为数值（PX），可从滑块高度排除。
选择器的高度降低
基本上，全屏滑块具有覆盖整个页面区域的滑块。
但是，在某些情况下，该网站的常见标题』『页脚您可能还想显示”。例如，看起来像这样→全屏“标题/页脚”包括
可能是台式机（尤其是笔记本电脑））在浏览器中，显示如下：
但是，在“全屏”滑块的情况下，如果您只显示“标题/页脚”选项，则必须将其设置为通常显示以下显示它将成为。你看到区别了吗？
滑块区域被推到标题中。原因👇
- 对于“全屏”类型，“浏览器高度=滑块高度”
- 滑块高度通常是按通常显示的标头和页脚计算的。
- 显示标题时，将滑块推向其高度。
→结果，滑块的底部被标头的高度切断。
为了避免这些，选择器的高度降低“将设置为”。
从下拉菜单中使用本地选择器'，将显示两个输入字段如下：在此处指定与标题和页脚相对应的元素（选择器）。
如果要在一个列中设置多个元素，则可以输入将它们通过逗号分隔（，）。您要输入的元素的名称（选择器）是您的名称WordPress这取决于主题。
设置后，计算如下：
浏览器高度- （（（标题和页脚高度）=滑块高度
从理论上讲，计算滑块的高度适合浏览器，包括“标头和页脚”，对于较大的显示屏，也显示了页脚，如下所示。
但是，“滑块高度”是滑块中的“滑块高度”文本或者按钮，利润它受产品高度的影响，因此实际上不能尽可能低（无法变得更小的限制）。
因此，笔记本电脑上显示的高度有一个限制，因此在大多数情况下，页脚将可见。在某些情况下，滑块的底部可能会略微可见。 （嗯，清除页脚很好。）
因此，如果您创建一个带有标头的全屏滑块，则需要设计滑块零件，考虑到标头的高度。
自定义大小
『自定义大小'默认情况下关闭。
以下解释（操作说明）说：“很少需要此选项。”换句话说，可以理解您几乎没有机会使用它，或者您可以以不同的方式做同样的事情。
操作说明翻译👇
此选项允许您自定义每个设备的长宽比。有关更多信息，请参见文档。请小心。此选项很少需要，很难正确设置。
但是，我将以简单的方式解释这些功能。
『自定义大小当“打开”时，以下将用作移动的』『药片现在，您可以在使用“宽度和高度”时设置“宽度和高度”。
例如，滑块大小如下：2：1'设置为水平比。
通常，当您缩小浏览器的宽度时，滑块将保持纵横比它将以减小的尺寸显示。但是，即使显示得太小，它也可能不会作为滑块有效。
当我在智能手机上看到它时，它太小而无法理解
如果滑块内部有任何文本或按钮，则由于高度（例如垂直），滑块的长宽比也会改变。
那里自定义大小“在”移动的』『药片暂时设置纵横比。这使得有效地在任何设备上显示图像成为可能。
（蓝色框架：平板电脑，红色框架：智能手机）
“自定义大小”的示例
它可以用于景观照片中，例如，即使切割左侧和右侧也没有主要问题的情况。
但是，由于您可以使用“幻灯片编辑”功能做同样的事情，因此您应该故意有资格”自定义大小该官方教程还指出，如果不设置它，就没有特别的问题。
概括
这次，我们将介绍“滑块设置”部分。尺寸我们已经解释了“”。滑块大小“和”背景图像大小一旦您了解了“之间的关系”，它将使后续的工作非常顺利，这使其成为非常重要的部分。
除了“滑块设置”，
『操作』『动画片』『自动播放』『优化』『滑动』『开发人员有一些项目，例如“，我们还将在其中的详细信息中添加相关文章。
尝试使用Pro版本
阅读本文并单击Pro如果您认为“我有兴趣使用该版本”或“我有兴趣”，则以下文章详细说明了如何安装它。