使用iframe替代html5中的帧 [英] Alternative for frames in html5 using iframes

查看:161
本文介绍了使用iframe替代html5中的帧的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是HTML5的新手,我做了一些研究,发现< frameset> 的使用已经过时,而且我读到了< iframes> 不是。所以有人可以帮助我,我想获得与示例相同的结果,但是使用< iframes> 或另一个替代< frameset> ; 在HTLM5中不被弃用?

 < frameset cols =20%,* > 
< frame src =menu.html>
< frame src =events.html>
< / frameset>


解决方案

框架已被弃用,因为它们导致网址导航出现问题和超链接,因为url只会带给你索引页(带有框架集),并且没有办法指定每个框架窗口中的内容。
今天,网页通常由诸如PHP,ASP.NET,Ruby等服务器端技术生成。因此,可以简单地通过合并模板和内容来生成页面,而不是使用框架:



模板文件


 < HTML> 
< head>
< title> {为标题插入脚本变量}< / title>
< / head>

< body>
< div class =menu>
{通过服务器端脚本插入的菜单项}
< / div>
< div class =main-content>
{服务器端脚本插入此处的主要内容}
< / div>
< / body>
< / html>

如果您没有完全支持服务器端脚本语言,那么您也可以使用服务器-side包括( SSI )。这将允许你做同样的事情 - 即。从多个源文档生成单个网页。



但是,如果您真的只想将网页的一部分作为单独的窗口,您可以在其中加载其他网页网页不一定位于您自己的服务器上,您必须使用 iframe < a>。

您可以像这样模拟您的示例:

框架示例

 < html> 
< head>
< title>框架测试< /标题>
< style>
.menu {
float:left;
width:20%;
身高:80%;
}
.mainContent {
float:left;
宽度:75%;
身高:80%;
}
< / style>
< / head>
< body>
< iframe class =menusrc =menu.html>< / iframe>
< iframe class =mainContentsrc =events.html>< / iframe>
< / body>
< / html>

可能有更好的方法来实现布局。我使用了CSS float 属性,但可以使用表格或其他方法作为好。


I am new to HTML5 and I have done some research and found out that the use of <frameset> is outdated and from what I read <iframes> are not. So can someone help me, I want to obtain the same result as the example shown but while using <iframes> or another substitute for <frameset> that is not deprecated in HTLM5?

<frameset cols="20%,*,">
    <frame src="menu.html">
    <frame src="events.html">
</frameset> 

解决方案

Frames have been deprecated because they caused trouble for url navigation and hyperlinking, because the url would just take to you the index page (with the frameset) and there was no way to specify what was in each of the frame windows. Today, webpages are often generated by server-side technologies such as PHP, ASP.NET, Ruby etc. So instead of using frames, pages can simply be generated by merging a template with content like this:

Template File

<html>
<head>
<title>{insert script variable for title}</title>
</head>

<body>
  <div class="menu">
   {menu items inserted here by server-side scripting}
  </div>
  <div class="main-content">
   {main content inserted here by server-side scripting}
  </div>
</body>
</html>

If you don't have full support for a server-side scripting language, you could also use server-side includes (SSI). This will allow you to do the same thing--i.e. generate a single web page from multiple source documents.

But if you really just want to have a section of your webpage be a separate "window" into which you can load other webpages that are not necessarily located on your own server, you will have to use an iframe.

You could emulate your example like this:

Frames Example

<html>
<head>
  <title>Frames Test</title>
  <style>
   .menu {
      float:left;
      width:20%;
      height:80%;
    }
    .mainContent {
      float:left;
      width:75%;
      height:80%;
    }
  </style>
</head>
<body>
  <iframe class="menu" src="menu.html"></iframe>
  <iframe class="mainContent" src="events.html"></iframe>
</body>
</html>

There are probably better ways to achieve the layout. I've used the CSS float attribute, but you could use tables or other methods as well.

这篇关于使用iframe替代html5中的帧的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆