htmlframe框架使用方法

框架， htm 的框架，这个框架这个技术呢啊，非常古老，当年呢也是风光无限的，那么可是现在呢，应用的场景比较少了，但是呢，在某些场景当中啊，使用它呢还是比较灵活的 啊。对于框架，我们稍微来了解一下，使用框架呢，我们可以在同一个浏览器窗口当中啊，显示多个页面， 那么每一个页面实际上都对应的啊，每一个 htim 文档，那么这样的一个单独的文档就称之为一个框架， 那么并且呢，每个框架都独立于其他的框架，就是他们之间呢，不受啊，互相的影响，那么这些框架啊，组织在一块，就形成了一个框架级。 其实呢，之前给大家讲过啊，文档实名，那么对于我们的 htm 八五啊，在这里面应用框架的话，似乎 是不用声明，这个呢，我也不是太确定啊，当然了，要是使用之前的版本啊，那需要这个声明这个框架文档的。 对于我们这个框架呢，在使用的时候啊，除了在特殊的场景当中运用，另外呢，他还是有一些缺点的，比如啊，你假如想打印整个页面，那么这个呢就很难办到啊，当然了，这种应用场景呢，也非常少。 好，下面我们来了解一下这个框架。第一个呢是框架级啊，刚才已经说了，多个框架呢，就会组成一个集合，那么这个集合就用谁来表示呢？英文 fmx 啊，这样的一个元素，他们就可以定义一个框架级 啊，这样的一个框架机，就是用来组织多个窗口啊，实际上就是多个框架，每个框架呢啊，都是对应着一个单独的独立的 htm 的文档。好，那么这里面有 一个说明，在使用框架级的时候，必须要使用两个属性，当然了，只是只使用其中一个就可以，但是必须要有一个，一个呢是肉啊，这个单词本意呢就是行的意思，还有个克拉姆斯，这个意思呢，就是列， 那么由这两个属性呢，就可以分别定义一系列行或者是列这里面的值，他就分别定义了每行或者是每列，占据我们这个浏览器窗口的啊，面积大小。 好，我们看一下吧， 先建个文档。 好，注意，新建完文档之后呢，默认的是 htm 文档，我们要改写一下。之前呢他的这个包的啊，这个标签，我们就得必须把它删掉 啊，整个删掉，然后直接使用我们的 fm 塞就可以了，这就是一个框架机 啊，一个标签，那么我在保存的时候往往呢会弹出多少方，因为这里面一些必要的属性我还没设置，他在里面说了，这个框架机不包含行和列，默认为是两行啊， 什么都不管他了，我们预览一下啊，预览一下，预览完之后呢，会发现这个窗口挺有意思的，分为上下啊两个区域，中间呢有个分割的一个条啊，可以上下分割，这是默认的， 刚才真命卧呢已经给我们提示了，默认会有俩，那么这些窗口就是默认的。这两个窗口现在呢是上下啊排列的，那么我能不能让他水平呢？我能不能定义多个呢？可以，这里就得需要我刚才所说的两个属性，一个是 rose 啊，一个是克拉姆斯。好，我们试一下吧，比如肉行，那么这里面的值是多个值，有多少个值就代表有多少个框架，比如百分之三十啊，我用百分比了啊，固定值可不可以呢？也可以。好，另外一个呢是百分之七十 啊，保存一下，我们再看。现在呢，刷新一下，上面这个好像占据的这个空间不是太准确，是吧？啊，不是太准确，但是大概呢，应该是这样啊，我再试一下吧，比如百分之二十，刚才看着这个比例有点不太对。 好，这就对了，那么刚才我指定的，呃，是行，行指的是什么呢？就是每一个这个框架他都是水平啊，通蓝的，你这么认为就可以了。第一个呢，指定的就是第一个框架啊，他所占的这个比例 也就是在占了屏幕的高是多少？百分之二十，那么第二个呢？是第二个框架说占用的这个高啊，是多少 啊？默认情况下已经有两这个框架了，那么假如我希望有第三个，可不可以呢？也也可以，比如这里面百分之五十啊，再来一个二十，五十，还有个三十啊，百分之三十。好，再保存一下，刷新我们就会发现呢，一共有三个了啊，二十，五十，三十。 好，那我能不能再定一个这个垂直的呢啊？当然可以了，好，我把这个肉丝呢给他删掉，换成 coloscolums， 等于他的值也是一样，比如百分之二十啊，百分之七十啊，故意呢，不让他百分之百看一下， 好，刷新哎，要保存了啊， 好，看一下，还没保存呢，注意啊，这个框架保存很有意思的啊，大家看一下，这个左上角有个信号，就说明了当前是没有保存， 那么没有保存的话，这里面又预览不出来，那么怎么样才能保存呢？你手不要放到不同的位置，那么有可能保存的就是不同的这个元素。这是追问我这个软件啊， 呃，一种行为，其实真正来说呢，他毕竟是一个成本文件啊，你管我在什么地方保存吧，对吧？好，如果实在遇到这种情况，那不行的话，那只能怎么着把它关上，这个时候呢，他就会提示是否提示是否要保存，然后呢再把它打开就行了吗？啊，好，我们再看一下这个效果， 那么这效果有可能还没出来，没出来那就拉倒了啊，可以看到呢，右上角还是带有这个信号，说明呢，还没保存。为什么没保存呢？ 就是因为啊，就是因为准备代码怎么给我们改写了啊？看一下啊，给我们代码改写了，就是因为里面缺少一些必要的啊，一些元素。 好，那么这个呢，我改一下这个，改一下这个肉呢？留着吧，肉是比如是星号，星号的话就代表什么呀？代表不就一列吗？对，一行吗？那么他从往那卡罗姆斯呢，那么就代表两列，实际上就是水平上进行排列了。 老保证不了啊，保证不了那就算了啊，因为等会呢，我们指定了其他的一些属性啊，就可以保存了。好，我们继续啊，继续。那么对这个框架棋啊，有哪些属性？刚才呢，我们已经用到两个了，那么他这里面的值呢？刚才我使用的是百分比，其实呢还可以 使用这个信号啊，这个信号信号代表的是什么意思呢？就代表制度啊，你自己来计算。那么其实刚才我们这里面已经有个信号了啊，一般情况下不会设信号的，其次呢还可以设这个具体的一个值，比如这里面是二百啊，这个呢是三百， 或者是这个是阿白啊，然后呢这个是多好呢，这个是新号啊，这个意思呢就是首先你固定了，然后剩下的都给我了啊，就这个意思啊，还是这样挺讨厌，不用管他。 那么还有哪些值，还有一个 fm 啊，我这样吧，还是给他加上吧，要不然挺讨厌的啊。呃，首先啊，新建几个文档，因为等会呢我会说到啊，比如这个叫 top 点，他去天安门了一个了啊，然后再新建一个，嗯，叫坡头 姐，而且电还满了。好在这里面指定一下啊，你看要是不指定的话他老老会感谢我的。干嘛啊，这个证明我有时候挺自作聪明的。 好，我在这里面呢放两个框架啊，我们的 fm 赛的是框架级，现在呢 fm 呢是框架，我再分开一点啊这个呢等会我们会讲到现在呢，不用管他，一个是 top 点 ht m 一个是 oto， 快去 kim 了，嘿，什么玩意。好，现在呢我们来保存一下，然后再来看一下，小心 啊，还有这个提示吗？就没了吧。好，那么我我把这些东西呢再添加一下吧。 是好，保存一下，先关上，别受干扰。包头我们也写一下提示好关上。 好，现在呢有了啊，我刚才是靠了没呀。哦，他又改写了，看见了吧，我们把这个肉身呢给他上上啊删掉，然后 好来个新号。几号只有一号啊只有一号嘿，怎么回事， 这个软件是不是有问题啊，那就这样啊，往前用行可以吧，比如这个是百分之二十，这个是百分之八十啊， 刷新一下，这没问题吧，先用好。呃，现在呢，我们来继续说这里面的一些手势。这里面第一个 fm fm 包的这个是来设置边框的啊，他的值呢？是一个不法值。可以是啊，是零和一，零呢和 no 呢，都代表假，就是不需要这个 啊，这个边框一或者 yes， 就是需要这个边框，默认情况下可以看到有啊，可以看到有，好，我们还可以把它给它闭掉。那么在这里面添加到 word 啊，比如射成零或者是 no， 俩是一一个意思 好，再下线，还有吗？就没了啊，就没有这个边框了。第二，如果有边框的话，我们的边框的宽度是多好，他使用的是波的啊，这个波的呢？不是设置边框的啊，是设置边框的宽度的，因此呢， 这个我还是给他打开好波的，比如我给他设成二十，再看一下怎么不会自动刷新了，这个挺讨厌。 可以看到这个宽度啊，就是二十，同时还有一个啊波的卡了，能够指定我们这个边框的这个颜色再来这样，比如给一个什么颜色呢？哎，实测器选择一个吧，比如红色啊。好的，刷新 现在显示的是什么颜色啊？是黑色，难道是我这个颜色选择错了吗？我们再重新选择一次啊。应该不是啊，我鼠标放上面，大家可以看到啊。哎，怎么不提示了 好不，提示款，那么现在我们打开阿易啊，用阿易看一下 地址，复制过来显示红色了，这说明啊，这个兼容性是有问题的，对吧？好，另外一个还有个 fm stey 形，就是框架之间的这个距离啊，两个框架之间有间距的啊，你应该把它来设置一下 白水，比如十啊，能看到效果吗？刷新看不到效果吧，没什么效果。说明呢，兼容性还是有问题的， 那么对于这些东西，有些兼容性有问题的怎么办呢？其实呢，根本就不需要这件事情，因为在真实的应用当中，我们是这样来做的啊， 这些东西全部是删掉的啊，不要了。然后呢，这个拨的呢？有时候也不需要。哎，这 yes 弄错了啊， yes 弄错了，是不是刚才这个 yes 的事我们试一下吧。啊？ 是吗？不是吧啊，好，再回来，那么这个东西我给他删掉啊，真实的是这样用的 波的呢？给他射成一，如果需要的话，就这样显示不也挺好看的吗？其次呢，要我们的 css 干嘛用的，专门是来进行定义的， 大家可以看到这个 ie 呢，也有问题啊，或者是根本就不需要这个边框，也就这个边框呢，我们可以给他射成零，然后呢这个呢？给他射成六。好，为了能够掩饰啊，我还是把他射大一点，这样的话，等会我们知道每一个框架他所在的区域在哪 好，那么这层四层二瓦稍微有那么一点就行，这是框架级的这个属性啊，那如果要是不支持这个框架级怎么办？ 我们就得使用一个啊， no fms 这个标签，那么这个标签呢，就是提示我们的浏览器啊，如果你要是不支持在哪写，在这写好往下来一点， no， 然后在这里面记住，你既然不支持这个框架，那么你就应该支持哪个标签？支持普通的 htm 老标签，普通的 htm， htm 标签里面必须要有什么？必须要有包的啊？所以呢，在这里面啊，得加上我们的包的啊，你的浏览器啊， 不支持，什么玩意？ 放五天可以了啊。那当然了，还可以加上超链接或者是正常的一个页面信息，就是不支持放假的，那么你可以给他呈现一个正常的页面， 当然了，我们这里面呢都支持，对吧？好，我们看一下火壶啊，是不是支持其实这个框架呀，当初啊，就是有这个火壶的老东家啊，我们再来 这个开发出来了，如果大家呢，听过我们之前的那个课程啊，就是第一节还是第二节讲过这个浏览器 或者是他的内核的一些发展，包括发生的这个浏览器大战啊，你就明白这个框架他的地位有多高。好，可以看到呢，火狐也支持好他呢，我就关上了啊，不使用他了。 ok， 我们继续说这个，说完了。

好的，大家，那么接下来呢，咱们说一个好玩的标签，叫做音视频标签啊，音视频标签， 那么音视频标签的话，大家猜应该也猜出来是干什么的了啊，之前咱们是不是往一图往 页面中引入过图片呢？哎，就是学过图片标签，那么所谓的音视频标签就是往页面中引入一个音频或者啊视频，对吧？叫像页面中引入音频或者是视频。 那么需要注意的一点是什么呢？这两个音频和视频呢，他们俩的使用方式几乎是一模一样，说二者使用方式一样，那么也就意味着大家会一个是不是另外一个也就会了呀，哎，那么说使用这个 id 五标签呢？标签像页面中 引入一个叫音频，然后使用呢叫 v 六标签呢？标签像页面中引入一个视频即可。好吧，那么就过来呢，我们就引一下，首先来个音频，哎哎呦 dio 叫哎呦，电音频音频，这 src 是不是又是路径啊？啊，这不用多说了吧，哎，引入，你需要引入这个音频的路径，我这个也妹子是下边呢，有一个音频叫一点 mp 三，对吧？就是当前 路径下，你妹子是下一个一点 m p 三，我是不是又用的相对路径啊？ ok， 那这时我直行， 哎，完了，坏了，发现什么都没有，是吧，并没有引入进来，这是为什么呢？大家注意，这时呢 就涉及到属性了，对吧？啊，叫二者，就是上述二者常用属性，有什么属性呢？首先第一个啊，叫做康守属性对吧？叫 c o n t r o l s， 那这个属性呢，是用来干嘛的呢？用于设置是否允许用户控制播放，对吧？就是是否允许用户控制播放，那么呢，他的值呢？等于他自己对吧？就是 属性名和属性值一样，那么此时大家注意，当你属性的值与属性名一样时，其实这个等号和这个属性名啊，可以省略不写啊。咱们在这里呢，稍微注意一下，这是 h 五的一个特性啊，说一说 htm 苗五中啊，若属性名与属性值相同时，对吧，那么这个等号双引号属性值可以 省略不写，其实跟就跟我们现在这个效果是一样的了，听懂吗？所以说这个属性是用来干嘛的呢？叫做 啊，是否是否是否允许用户控制播放？那么默认或者说叫不加则不加，这个属性不加则是不允许， 所以说刚才我们没加，导致我页面上什么都没有，那现在我是不是加上了呀？加上了之后呢，我们过来刷新一下，哎，就有了，就把音频引入到了页面当中，当然你点击播放， 人中坚强 怎么样？还挺上头是吧？小点声，听着吧，挺上头。那么除了这个属性以外，还有什么常用的属性呢？就是自动播放啊，叫做 out。 好嘞，叫自动播放。那我刚才说了，如果属性名和属性值相同，你是不是等号属性名啊？等号属性值可以省略不写啊，那这样的话就自动播放了，他总跟我抢是吧，那我看看他是不是自动播放了啊？刷新刷新刷新， 哎，发现没好使，对吧？为什么呢？大家注意这个呢？其实是浏览器的一个功能对吧？就是有的时候呢，他这个浏览器他相对来说比较人性化，他担心什么呢？担心你不 小心打开一个页面，人家给你出一下子放一个音乐，然后吓你一跳。说到这个大家，我给大家分享一个我自己的一个亲身经历啊，那个时候我还在上 初中的时候，然后呢，我们家里头有一台电脑，我那个房间呢，又有点黑，进不太来，不是黑，就是那天是个晚上，然后那时候我们家房子挺大，我一个人在家， 然后那时候流行那个 qq 空间，对吧？然后我就看人家的 qq 空间，看人家 qq 空间呢？然后就，然后人家那个文章写的什么呢？叫呃仔细，然后呢？找不同，然后给你整两张图片，然后让我找不同， 然后我就找啊找找，我特别的专注的去找，然后忽然他就出来了一大张一张鬼脸，完了并伴随 他，他，他让你找不同的时候，还让你把耳机带上，把声音调大，然后专注的找，然后我就真专注的找，然后正在我专注的时候， 弹出一张图片啊，特别恐怖的鬼脸，然后同时放着那种呃惨叫的声音，这还不算什么，最关键的是当时我们家所有的电就都停了，包括我那台大电脑的那个显示器，砰都全都灭了， 那大家能想象到那种场景，这对我印象实在太深了，对吧？当时当时我就感觉脑子里头空白了，然后呃过了不知道能有几秒钟也好还是几分钟也好，就然后我那个显示器那个灯嘣 又亮了，灯也亮了，然后我才慢慢的缓过神来，能想象到那种场景吧，分享一下啊。那么这个实际上人家浏览器 功能什么意思呢？就是怕担心刚才像我这种情况发生，你打开浏览器，人家给你来了一个音乐，吓你一跳，对吧？哎，那这是可是我们骨骼浏览器比较人性的一个地方，那么 ie 的话人家就不管你了，对吧？ ie 的话大家注意看有没有自动播放， 你看要是出现这种声音是不是就吓一跳啊？ 好了，那这个就是像这个页面中引入一个呃，这个音频，对吧？顺便呢给大家分享个小故事。好像有点废话，耽误大家时间了啊，不好意思。 然后呢，这个这个奥特普勒写一下干嘛呢？就是啊，是否自动播放，就是控制是否自动播放，控制是否自动播放的，然后还有一个什么呢？就是 是不是循环播放叫做 loop 标签还是属性名？属性值一样的话啊，就是可以省略不写，好吧啊， loop 就是控制是否循环播放， 叫控制是否循环播放。那么比如说什么是循环播放呢？我现在是不是加上了呀？然后呢，我这首歌啊，比如说播到了， 哎，哎，我瞄不准，行，五秒，五秒吧。啊，注意看感受啊，他就从头重新再来一遍，就单曲循环了，哎，我，我没刷新，不好意思，白瞄了， 看一下啊，注意看，是不是又播放重新播放了呀，哎，这就叫循环播放啊，控制循环播放。行了，那么这个呢， 就是音频标签，像页面中添加音频，但是此时注意呢，这是添加音频的方式一，叫做添加音频的方式一，那么也就意味着是不是也有添加音频的方式二啊？哎，也有添加音频的方式二， 叫做添加音频的方式二，这个方式二是什么意思呢？他可以嵌套 sous 标签引入音频啊，可以嵌套叫做 sus 标签呢？引入音频，比如说我们可以搞一个 a 丢属性， 而 id 标签，然后呢，他并不在 id 中去指定你引入音频的路径，这里边呢，欠套一个 source， 欠套一个 sous 标签，然后在这里边指定 srce， 然后呢， 妹子私下一点 mp 三，看懂吧。哎，在这里面去指定，然后呢，一执行啊，发现没有？没有是为什么呢？因为我没开启控制啊，开启一下，控制执行有了，一播放，一播放也没问题，听懂吧？ 这时小伙伴就说，哎，那这明显上边那个更简单一些，这个有点麻烦，还得多系一个标签。但是第二种方式啊，他有优点，优点在哪呢？他可以解决浏览器的兼容性问题， 听懂吧，可以解决浏览器的兼容性问题，为什么呢？因为这个音视频标签他是 h 五出的新标签，所以说在浏览器兼容性上还没有那么的完善。比如说大家注意看我艾 e， 艾 e 的话，艾 e 的话呢，他只有艾艾 一九开始才支持了这个，哎呦呵，卡住了，哎， 不好意思，大家刚才卡住了，我们继续啊。那么我们刚才说了说这个音视频标签其实是 h 五出的新标签啊，也就是说他浏览器的兼容性上还没那么好，比如说 ie， 这个 ie 我刚才开，他就开，他卡住的，打打开， 哎，这就是爱意，爱意呢？他是爱意久以后才支持音视频标签，比如说 f 十二，现在呢，我是爱意十一，那如果我要把它变成爱意八的话，发现是不是就不行了呀，什么都没有，那这个时候我们是不是就希望 能给人家来点提示啊？比如说你要是，哎，一八，那我给你点提示，说对不起，您无法，您不支持这个音视频，请你升级浏览， 是不是这意思，对吧？那有能支持的就播放，没支持的，我也让他有点提示，那么怎么办呢？那么这种形式也就是添加音频的方式就派上用场了，他可以在这里来一个叫做对不起您，呃， 无法播放，对吧？叫无法播放音频，请升级浏览器，是不是有这种效果呀？哎，那么这时如果是 ie8 的话， 他给你个友好的提示，对吧？对不起，无法播放音频，请升级浏览器。那如果你是其他支持的版本的浏览器的话呢？那他就可以正常的播放音视频， 听懂这意思吧。哎，所以说，那么第二种方式是不是有优点呢？有优势。嗯，所以说他的优点，优点，优点 是什么呢？可以处理浏览器的兼容性问题，所以说更建议用第二种方式， 甚至于大家注意每个浏览器呢，他支持音频的格式也不一样，对吧？有的浏览器比如说有一个比较特别的音频的格式，我就不给大家下载那个音频了，啊 啊，我也就不去找了，大家知道就行。比如说有个音频的格式叫 ogg， 那这个音频格式呢？不是， 是所有的浏览器都支持的，那我们就完全两个都写这里，然后呢，你浏览器支持哪个你就用哪个，对吧？哎，一个 mp 三，一个 ogg， 对吧？那浏览器去判断有没有，首先有没有支持， 支持的话看看支持哪一种音频格式，那么支持哪个就播放哪个，这里边你可以写多个 sous 标签，听懂吧？支 支持哪个就播放哪个，对吧？看是不是也还是显示一个呀，他支持哪个他就播放哪个即可，选择一个 就行。好吧，行了，那么这是音频，那么视频是不是一模一样啊？哎，音频呢用 a 丢标签，视频呢就是微丢标签。然后呢，我们是不是更提倡第二种方式，利用 sous 的这种方式去引入 音视频文件呢？比如说音妹这次下有个一点二 mp 四，对吧？哎，当然呢，我们也可以在这里 为兼容性啊做个铺垫，叫对不起，无法播放视频，请升级浏览器啊，当然，现在我们这个是支持的，一打开，对吧？哎，这个视频就引入进来了，注意看，现在我控制不 不了，对吧？为什么呢？因为我没开启康守斯这个属性，开启让允许用户控制点开。哎，那就引引入进来了，这时有播放按钮了，对吧？那此时点击播放。一九九六年出过一道很有趣的题目， 说有一个女的放狗咬你，你打不赢这个狗，你把这个女的咬了一口，这叫个正大方，当然叫了擒贼 先秦王，怎么样？大家，对吧？哎，不仅可以学编程，还能掌握点法律知识，他告诉我们什么意思呢？说如果有一天有人放狗咬你的话，不要跟狗打，对吧，去打他的主人就可以了。行了，那么以上呢，就是音视频的标签。

先用 joy 点 switchtwfv 切换到 fm 里面去，进入到 frm 中之后再进行原数定位操作，操作完成之后从 frm 中切换出来。

我又用 framer 做了一个网站， gsap 动画框架，官方文档的中文翻译网站，它的网址是 gsap 点 framer 点 wiki。 那 gsap 这个动画框架呢？是目前前端领域非常出名的一个动向框架，但是他的学习资源并不太多，尤其是中文的学习资料其实挺少的。那他的官方呢？有一些英文的文档教程，我看了以后呢，觉得，哎，质量还不错。 那刚好我也是在我的这个 g s 课程里面呢，也是讲了一些 g s a p 的使用。那我呢，干脆就把相关的一些文章翻译出来，整理到这个网站上分享出来，帮助其他有需要的同学。 那顺便呢，我也通过翻译来坚持每天练习一点英语。那这个视频录制的时候呢，我已经翻译好两篇文章了。那这两篇文章你看过之后呢，你就能掌握这个 gsap 的基本使用了。那后续的内容呢？我会每天坚持都翻译一点啊，一点一点的来更新。

这期视频将讲解 a fm 原语的基本概念，以及他们与实体组建框架的关系。 a fm 至于 h， t， m， r 和使用 power 实现的自定义元素， 大多数现有的工具和库都支持使用，包括 react， view 等等。底层实线上， fm 实际上是一个实体组建框架，基于 three j s 并以声明的方式来暴露编程接口。 a fm 提供了一些简单易用的元素，比如 a box 和 a sky。 这些被称之为源于封装的实体组建模式，使其对初学者容易使用。下面通过一个简单的呆萌演示， 首先引入 a fram 脚本库，通过 a 四印场景组建帮助我们设置画布、渲染器，相机等等。使用 abox 可以创建立方体， position， 自定时体在三 d 空间中的坐标值， rotation 设置旋转角度以及 carl 设置材质的颜色。 a sphere 创建球体， radius 设置球体的半径。 a c 领的创建圆柱体。 height 设置柱体的高度。 a plan 创建平面 with 设置在 x 轴上的长度。 height 设置在 y 轴上的长度。最后， a sky 为场景添加背景颜色，也可以通过 source 添加三百六十度背景。这里图片应该是等距柱状投影格式。我是在 u e 四中导出 h d 二图， 大家可以参考油管上的视频教程。圆玉主要是为新手提供一个易用的语法封装层，具备如下特征，有语义名称。有一组带有默认值的预设组件， 将 html 属性映射或代理到组建数据。源于类似于 unit 中的 prefat 实体组建系统模式中将他们称为组合和新的实体组建 api 抽象 为预先组成联通规定默认值的有效组建实体类型的速写方式为初学者提供类似 html 标签的编程接口。在底层实现中，这个 a box 原语表示如下，实体组件形式 a box 默认 geometry primitive 属性为 box， 并且映射 html weight 属性为底层 geometry weight 属性。同样的 html color 属性对应底层的 material color 属性。

哈喽，小伙伴们大家好，我是二毛，今天和大家分享的内容是 html 当中的框架，那目前我们看到的这个运行结果就是由这个框架来实现的，那接下来呢，我们来看一下这个框架的代码， 其实呢，呃，这个 fream， 那它就是一个框架标签。那我们刚刚看到的这两部分内容呢，都是由这两行代码来实现的，它就是在当前的页面当中再去嵌入另一个页面， 那里边的这个表单点 html 还有表格点 html 是我们之前分享过的内容，那我们就通过这个框架的形式来把它 啊嵌入到我们当前的这个页面当中，那后面的 ys 和 height 呢，就是分别设置了它的宽高，那所以呢，我们会在运行结果当中去分别看到这 表单的内容，还有表格的内容。那以上呢，就是今天二毛要和大家分享的框架内容。好了，小伙伴们下期再见。拜拜。

free 框架实现画面跳转，要实现在这个地方画面跳转，演示一下，在基本的里面找到 free， 添加需要跳转进去的画面， 调节以下大小， 再放几个按钮， 比如说这是 a 画面，改一下大小， 按下的时候切换框架，视图切换到 a 画面，可以复制几个， 可以给他们对齐，左对齐， 垂直间距相等，然后更换一下 零一二三 登录看一下效果。 b 画面。 c 画面。 d 画面。 a 画面。

大家好，欢迎收看零基础学前端系列课程，我是主演老师张荣明。三十，他开的属性与贝斯标签。 本次课程中，首先我们会讲解他给的属性，然后呢会讲解默认打开方式，首先他给的属性是设置链接的打开方式， 什么意思呢？我们打开一个链接，是在当前页面中打开呢？还是新建一个太保页打开呢？还是在页面的局部打开呢？ 那么这时他给的属性设置的含义，那么他的属性值有以下这么几个，第一个四 f 是在当前页面中打开页面，也就是说新页面会覆盖当前的页面。第二个下线 flax 是在新的 太部页中打开，那么会创建一个新的窗口来打开页面。第三个下线烹饪会在副窗口或副框架中打开。第四个下线 top， 将页面在整个浏览器窗口中打开。 第五个肥内指定框架中打开页面，注意后三个 是与框架相关的，那么我们将在后面的课程中讲解框架，到时候呢我们再详细的讲解这三个使用值，我们先看一下前两个 好了还是呢？首先我们在这里面去新建一个文件， 创建一个零一点 hpm 文件。 好了，那么这是一个 h 一零一页面的内容，我们再新建一个零二的文件。 好，这是零二页面的内内容。好了，那么现在呀，我想从零一这个页面中进入零二这个页面 好了，怎么办呢？通过 app 签来实现，当前，我们写个绝对路径，我们写一个相对路径，当前目录下面的零二点 hct ml 可以打开第二个页面。 好了，我们打开练习之后，我们一点击第二个音 页面的链接，就打开了零二页面了，注意他是在当前页面中打开的，来看一下，我们一点击他的时候，当前页面换成了零二页面的内容了，所以就是从当前页面中打开，那么怎么在新的页面中打开呢？我们来看一下， 在科目下面默认在当前页面中打开，那么如何在新的页面中打开呢？ 好了，那么我们可以给他一个，他给的等于下线 好了，那么此时我们点击他的时候就是在新的页面中打开了，那么我们说在当前页面中打开 还还可以设置 sif， 比如说呢，他默认值就是四 f， 我们也可以不用设置，我们一刷新也是在当前页面中打开，那么有什么用？比如说你在百度里面去搜索爱创课堂， 那么当我们点击爱上课堂官网的时候，他就是在新的页面中打开的，怎么能够做到在新的页面中打开呢？就是通过他给的属性设置的 默认打开方式，我们说在 croumer 旗下默认是在当前页面中打开新的页面， 那么怎么能够更改这种默认方式呢？我们可以借助贝斯标签的他给属性，那么他是用来定义 链接的默认打开方式的，我们也可以在 app 上重写他的属性来覆盖被子标签，当默认设置来看一下，也就是说呢，我们呀默认希望他是从新的页面中打开，而不是当前页面中打开，我们来设置被子标签， 那么我们可以书写 boss 给他一个，他给的是下先， 此时我们回到页面中刷新点击第二个页面，就会发现他已经在新的页面中打开了， 那么如果还想在当前面中打开怎么办呢？我们可以重写他给的属性，此时我们发现重写的标 可以在当前页面中打开，而没有设置到他给的属性的 ab 签呢？仍然是以默认的方式在新的页面中打开链接。 以上就是本节课的主要内容，那么在本次课程中，我们介绍的是他给的属性与背词标签。他给的属性呢？用来定义链接的打开方式，其属性只有下先、 sorr 下先 以及 famner 后三个需要涉及框架。我们在后面这个课程中讲解 默认打开方式，我们通过贝斯标签来定义 abc 的默认打开方式，那么在科目六六七下，默认是在当前页面中打开，一旦设置贝斯之后会影响所有的 a 标签，我们也可以在 abc 中重写他给的属性来 覆盖这种默认的行为。以上就是本节课的主要内容，感谢大家的支持，欢迎大家点赞、评论，收藏我们的视频，谢谢大家再见！

这节课介绍几种快速开始安装和使用 aphone 的方法。首先，最简单快速的方式是使用在线的代码编辑和预览工具。官方推荐的 greet 提供了一个在线代码编辑器， 我们可以在浏览器中直接编辑代码和预览结果，这是最方便的学习和交流工具。初学者可以通过查看官方的 demo 进一步了解 aphone 的写法。 也可以使用我平时最常用的 copen。 同样是在线的前端代码编辑工具，可以 foc 别人的代码，然后编辑调试。如果不想使用在线工具，可以搭建本地开发环境进行 调试。和所有 web 应用一样， a fram 也依赖于 web 服务器才能正常工作。当我们离线开发时，为保证资源文件能被正确加载和访问，需要搭建并启动本地 web 服务器。下面是一些可选 的官方推荐的简易方式。第一种方式是使用 npn ball five server 具有实时加载功能的开发服务器。第二种方式是拍等环境下可以使用内置的模块快速搭建 http 服务。除了官方推荐的两种方式以外， 我日常使用的是 vs code live server， 只需要在项目里右键就能启动本地服务器。如果选择本地开发，我们可以克隆或者下载代码模板包含了一个链接到当前版本 a from 的 html 文件， 一个可选的本地 what 服务器和一个简单的 giha pages 部署工作流。我们还可以直接引用 cdn 上已经构建好的 gs 脚本，或者通过 mpm 来安装，然后引入 a friend， 并且通过 wipe 或其他工具来构建。 如果使用 mpm， 还可以直接基于一些场景模板来构建应用程序，比如使用 angel 通过命令行配置参数快速初始化一个新的 aphone 项目。

四十五框架元素 frum 的创建，这个 frmm 也是一个容器，它里面也放其他的元素， 他的作用呢？就跟上一次讲的靠是一样的，但是他四周呢有线条围绕，并且这上面有一个文本作为表题，起到了解释的作用， 他的格式是 sg 点 pro， 这个大喜的 f， 我们看一看就是这个样子，里面写了姓名、 性别、国际，这里面有六个元素，这里面是六个元素，我把这六个元素 把它放在这个容器里面， 这上面写一个字叫做基本信息化， 这就是做了一个新的东西，叫做框架， 这是一个框架，这里面六个元素形成了一个整体的框架，那它有什么作用呢？那就跟上一次讲的裂壳是一样的作用， 他可以跟其他的元素去横向的拍或者是竖向的拍都可以了。 那么怎么来创建他呢？首先我要创建一个这里面六个元素的布局， 一十呢踢音，踢音，踢音，六个，就是这个， 这是个好，这几个小布局，我们给他取个名叫 ai 一好。然后我们来创建 这个大的布局，这个大的布局框架 l a 等于 sg 点 fm 置框架，看到了吧？这个框架， 这个上面这几个字，基本信息框是怎么来的？是怎么来的？那就是用 t t i t i 一是标题的意思啊，就是 t i t l 一等于基本信息化，就这五个字从这里， 然后那 out， 这是布局的意思，那就是这个布局吊用水呢？ 钓用的 ai 一，谁的布局呢？就是这个呢？普尔姆的布局就是这个框架的布局，框架的布局吊用 ai 成为一个 a 的一个大补血，这个大补血被整个的窗口调用，这就是啊框架的这个创建实际上也不难，要注意了，就这两个必须要写的 标题的文本和容器这个内，这框架容器内的这个布局就这两个，一定要先把它 上去，否则话就产生不了这个框架啊。其他的属性你可使也可不使你，你想使你就使，需要的时候就使，不需要时就不使，但这两个一定要使。好，好，谢谢。

今天将使用 afram 和 arjs 实现一个简单的 webar 图像追踪 demo。 首先引入两个酷文件，第一个是 afram a fan 是一个用来构建虚拟现实应用的网页开发框架，也可被用于增强现实 a fan。 至于 html 容易上手，提供一些简单易用的标签元素，比如 a box 和 a sky 等等。借助这些标签，初学者就可以搭建简单的三 d 场景。 第二个引入 a 二点 zs， 基于 aphone 的拓展库，支持基于标记和位置的增强现实。 接下来添加一个 ac 场景容器标签，用来包含所有实体，然后在 ac 中初始化 aops， 添加场景嵌入属性，接着给场景添加内容。我们从最简单的 文本开始，也就是 a text， 并且设置歪的属性为想要展示的文字，然后添加 a marker camera。 另一个根据标记位置移动的相机，官方提供了两个预设的标记，我们先设置相机，为跟踪最简单的预设标记， 结果没有看到预想的文字，原来是角度的问题，设置下字体颜色和旋转的角度就可以看到文字了。我们也可以添加图像，使用 a image 标签，设置 sous 图像路径以及旋转的角度，这样图像就出现了。 另外应用场景最多的是加载三 d 模型，这样可以使用 ant 的属性来表示一个实体，设置 gltf model 属性来指定 gltf 三 d 模型的资源路径，就可以在场景中加载三 d 模型，还可以添加 anime 选属性，实现简单的动画设置。动画为沿歪轴旋转的无限循环运动，这样我们的三 d 模型就运动起来。 最后我们来制作自定义图像组成的标记。注意，标记需要遵循以下原则，首先，标记必须有一个较粗的黑色边框，如果在黑色边框外还有一个白色边框则更好。 其次，形状必须是方形。最后，最重要的是标记的内容必须完全不对称，我们以对称的小电视为例，生成的标记会识别失败。 了解了原则后，就可以使用 ps 或者在线的工具 aijs market training excol 键标记。首先点击 upload 上传自定义的图片，自动创建好图案后，点击登录 marker 下载图案文件格式为 part。 接着点击 download image 下载生成的图 图像伟大代码里设置相机太谱为 pet 自定义图案， url 为刚刚生成。下载好的 pet 格式的标记文件就可以识别成功自定义的图案标记了。