位于上海,服务全国!

位于上海,服务全国!

html - 框

作者:admin 分类: 时间:2014-07-10 00:00:00 点击量:1181

html -  

框允许多个html文件被一次显示在一个浏览器窗口。 这意味着一个页面上没有内容,而是告诉你哪些网页要打开浏览器。 随着CSSPHP的出现,框已经过时,但如果你想使用它们,请继续阅读。

 

- 一个通用的框页面

框集最通常在一个框中有一个菜单并把内容放在另一框。 当有人点击菜单上的一个链接,然后该链接会在内容页中被打开。 此处是一个基本的“索引”框集,左边是菜单而右边是内容。

HTML Code:

<html>

  <body>

    <frameset cols="30%,*">

      <frame src="menu.html">

      <frame src="content.html">

    </frameset>

  </body>

</html>

框集

此处是示例 框索引

•      框集 - 父标签定义此框网页的特征。 单个框在内部定义。

•      框集- 即每一框都会有的宽度。 在上面的例子中,我们选择了菜单(第1列)占用总页面的30%,所用的“*”,表示该内容(第2列),将用本身剩余的宽度(70%)。

•      src=“” - 该网页的URL被加载到框中。

一个好的经验法则是调用包含该框信息为index.html的页面因为这通常是一个网站的主要页面。

添加横幅或标题框

添加行至标题和图形代码的顶部如下所示

 

HTML Code:

<html>

  <body>

    <frameset rows="20%,*">

      <frame src="title.html">

      <frameset cols="30%,*">

        <frame src="menu.html">

        <frame src="content.html">

      </frameset>

    </frameset>

  </body>

</html>

框边界和框空间

你可能已经注意到在帧之间那些难看的灰线。 是否可以移除这些和操作与框边界框空间之间的间隔。 这些属性出现在框集标记中。

标注 框空间和边界具有相同的属性但有些浏览器只识别一个或另一个所以同时使用具有相同的值是安全的。

•      框边界 =“#” - 确定是否会有一个边框。

•      边框 =“#” - 修改边框的宽度。

•      框边界 =“#”,修改边框的宽度由网络浏览器使用。

这里有一个相同但无边框的示例。

HTML Code:

<html>

  <body>

    <frameset border="0" frameborder="0" framespacing="0" rows="20%,*">

      <frame src="title.html">

      <frameset border="0" frameborder="0" framespacing="0" cols="30%,*">

        <frame src="menu.html">

        <frame src="content.html">

      </frameset>

    </frameset>

  </body>

</html>

框边框

这是一个视觉视觉

框名和框目标

怎样漂亮会让每个菜单链接加载到内容页 我们命名的每个框并在menu.html内部设置正确的基本目标链接。

HTML Code:

<html>

  <body>

    <frameset rows="20%,*">

      <frame name="title" src="title.html">

      <frameset cols="30%,*">

        <frame name="menu" src="menu.html">

        <name="content" src="content.html">

      </frameset>

    </frameset>

  </body>

</html>

HTML Code:

<html>

  <head>

    <base target="content">

  </head>

  <body>

    <!-- Content Goes Here -->

  </body>

</html>

框目标

此处是视觉效果 视觉

我们首先在框页面命名内容框内容”,然后我们设定menu.html内的基本目标链接指向该框。 我们的框页面现在有一个完美的功能菜单和内容布局!

不能变换大小和滚动

是否可能使用NORESIZEscrolling的属性进一步自定义<FRAME>标签。

HTML Code:

<html>

  <body>

    <frameset border="2" frameborder="1" framespacing="2" rows="20%,*">

      <frame src="title.html" noresize scrolling="no">

      <frameset border="4" frameborder="1" framespacing="4" cols="30%,*">

        <frame src="menu.html" scrolling="auto" noresize>

        <frame src="content.html" scrolling="yes" noresize>

      </frameset>

    </frameset>

  </body>

</html>

Noresize and Scrolling:

此处是视觉效果 视觉

•      noresize - 确定框是否可以由访客调整大小。 ”)

•      scrolling - 决定在框内是否允许滚动”)

我们把内容框设置为滚动yes”,以确保访问者将能够滚动浏览如果屏幕容不下所有内容的时候。 我们也可以把标题横幅设置为“不”滚动,因为一个滚动条出现在标题框没有任何意义。