zoralabIFRAME科技规范 - ZORALab赫斯提亚

主要目的

这个软件包的出生主要是支持渲染内嵌框架的界面元件。在网络界面世界里， 这元件的成果如下：

历史遗录

这个软件包在ZORALab赫斯提亚v1.2.0版本之前曾经被名为 iframe_hestiaUI。改名的目的是有人要横行强盗设计的版权和为了编程文件 编写能力而整理过。

设计师

这个元件的设计是由以下的创造者所建设的：

依赖其他元件

这个元件是需要以下的其他元件才能好好的运行 (排序从‘左上到右下’）：

HTML

至于HTML，为了简单化和最大的兼容性整个用法，ZORALab赫斯提亚运用W3C的语法。我们 推荐您用以下的HTML代码来运用这个界面元件。

最小的HTML

在最小的HTML代码运用方法如下：

<iframe src="..."
	sandbox="allow-scripts allow-same-origin"
	width="..."
	height="..."
	title="..."
	loading="lazy">
	...
</iframe>

环境响应的HTML

环境响应的HTML代码运用方法如下：

<iframe ...
	width="100%"
	style="aspect-ratio: [WIDTH]/[HEIGHT];"
	...
>
	...
</iframe>

隐形内嵌框架的HTML

隐形内嵌框架的HTML代码运用方法如下：

<iframe ... 和最小的HTML一样 ...
	class="hidden">
	...
</iframe>

切记：在HTML方面设入尺寸

这个元件是个特别HTML控制的。它的CSS尺寸如width和height 即使设下auto价值还是挺非常称霸的。如此以来， 您只能在HTML方面设入尺寸了。

<iframe ...
	width="..."
	height="..."
>
	...
</iframe>

CSS界面自选性

ZORALab赫斯提亚非常重用CSS变化值来装置这个界面元件并且还推出界面自选性功能。 以下是所有界面自选性CSS变化值任您发挥。

Display

影响元件的显示模式。

变化值     : --iframe-display
CSS属性    : display
默认数码   : block (>= v1.2.0)

Margin

影响元件的外向边距空间。

变化值     : --iframe-margin
CSS属性    : margin
默认数码   : 0 auto (>= v1.2.0)

Border

影响元件的边界线。

变化值     : --iframe-border
CSS属性    : border
默认数码   : none (>= v1.2.0)

Min-Width

影响元件的最少宽度。

变化值     : --iframe-min-width
CSS属性    : min-width
默认数码   : initial (>= v1.2.0)

Width （隐形）

影响元件在隐形情况下的宽度。

变化值     : --iframe-width
CSS属性    : width
默认数码   : 1px (>= v1.2.0)

Max-Width

影响元件的宽度。

变化值     : --iframe-max-width
CSS属性    : max-width
默认数码   : 100% (>= v1.2.0)

Min-Height

影响元件的最少高度。

变化值     : --iframe-min-height
CSS属性    : min-hieght
默认数码   : initial (>= v1.2.0)

Height（隐形）

影响元件在隐形情况下的高度。

变化值     : --iframe-height-hidden
CSS属性    : height
默认数码   : 1px (>= v1.2.0)

Max-Height

影响元件的最大高度。

变化值     : --iframe-max-height
CSS属性    : max-height
默认数码   : initial (>= v1.2.0)

Background

影响元件的背景。

变化值     : --iframe-background
CSS属性    : background
默认数码   : inherit (>= v1.2.0)

Visibility

影响元件的能见度。

变化值     : --iframe-visibility
CSS属性    : visibility
默认数码   : visible (>= v1.2.0)

Visibility（隐形）

影响元件在隐形情况下的能见度。

变化值     : --iframe-visibility-hidden
CSS属性    : visibility
默认数码   : hidden (>= v1.2.0)

JavaScript

庆幸的是这个元件没有运用到任何JavaScript。放心吧！

ToCSS

渲染呈现CSS的输出数据。

Hugo

用法：

{{- $ret := partial "hestiaGUI/zoralabIFRAME/ToCSS" . -}}
<pre>{{- printf "%#v\n" $ret -}}</pre>