导航栏界面(html_contents.html)

<!DOCTYPE html>
<html>
<head>
<meta charset=” utf-8” >
<title>框架列表</title>
</head>
<body>
<ul>
<li><a href="frame_a.html" target="showframe">Frame_a</a></li>
<li><a href="frame_b.html" target="showframe">Frame_b</a></li>
<li><a href="frame_c.html" target="showframe">Frame_c</a></li>
</ul>
</body>
</html>

框架a(frame_a.html)

<!DOCTYPE html>
<html>
<head>
<meta charset=” utf-8” >
<title>框架</title>
<style type="text/css">
.box{
width:auto;
height: 1000px;
background-color: brown;
margin:0;
}
</style>
</head>
<body>
<div class="box">
<h1>Frame_A</h1>
</div>
</body>
</html>

框架b(frame_b.html)、框架C(frame_c.html)与之类似。这里省略。

当行页面(导航框架.html):

<!DOCTYPE html>
<html>
<head>
<meta charset=” utf-8” >
<title>HTML导航框架</title>
</head>
<frameset cols="120,*">
<frame src="html_contents.html">
<frame src="frame_a.html" name="showframe">
</frameset>
</html>

实现如下:

HTML导航框架实现的更多相关文章

  1. ModernUI教程:如何使用你自己的导航框架

         Modern UI for WPF带有一个内置的页面导航框架,易于使用和可扩展的.但这并不是必须的,你也可以自己来自定义一个导航框架.      默认的ModernWindow控件模板包括标 ...

  2. WPF简单导航框架(Window与Page互相调用)

    相当多的WPF程序都有着丰富的页面和功能,如何使程序在不同页面间转换并降低资源占用,选择适合自己的导航框架就很重要了.最近花了一点时间做了一个简单的导航框架,并在这个过程中对Window.Page.U ...

  3. 精品干货丨APP常用导航框架

    文章目的:在整体上把握移动端App的导航框架,理解每种导航所具有的优点.局限性和其所适用的范围. 文章用心:典型APP案例(源码:http://www.jinhusns.com/Products/Do ...

  4. frameset导航框架

    1.制作导航框架(注意"name='mainframe'") <html> <frameset cols="25%,75%"> < ...

  5. 框架中的导航框架 & position定位

    框架中,通过链接将一个页面显示在另一个框架中:   总框架: <frameset cols="15%,*">   <frame src="xx.html ...

  6. WPF中的导航框架(一)——概述

    有的时候,我们需要一个支持页面跳转的UI,例如文件浏览器,开始向导等.对于这样的界面,简单的可以使用ContentControl + ContentTemplateSelector的方式来实现,但是有 ...

  7. [转]WPF中的导航框架

    有的时候,我们需要一个支持页面跳转的UI,例如文件浏览器,开始向导等.对于这样的界面,简单的可以使用ContentControl + ContentTemplateSelector的方式来实现,但是有 ...

  8. HTML 导航框架 (使用 Frame )

    文章出处  :  http://blog.sina.com.cn/s/blog_6f6d07f80100oqlt.html  (本文转自此博客) 在浏览网页时,我们经常会看到一个导航条,当点击导航条上 ...

  9. 用 Flutter 搭建标签+导航框架

    前言 在 Flutter 这个分类的第一篇文章总结了下最新的 Mac 搭建 Flutter 开发环境和对声明式UI这个理解的东西,前面也有提过,准备像在 SwiftUI 分类中那样花一些功夫来写一个 ...

随机推荐

  1. React-router的基本使用

    1.安装使用 $ npm install -S react-router import { Router, Route, hashHistory } from 'react-router'; rend ...

  2. 多重背包的二进制优化——DP

    #include<cstdio> #include<cstring> #include<algorithm> #define LL long long using ...

  3. Android 获取屏幕尺寸与密度(转载)

    android中获取屏幕的长于宽,参考了网上有很多代码,但结果与实际不符,如我的手机是i9000,屏幕大小是480*800px,得到的结果却为320*533 结果很不靠谱,于是自己写了几行代码,亲测一 ...

  4. Solr Windows环境安装配置

    在本章中,我们将讨论如何在Windows环境中设置Solr.要在Windows系统上安装Solr,需要按照以下步骤 - 访问Apache Solr的主页,然后点击下载按钮或直接访问:http://lu ...

  5. [CSP-S模拟测试]:导弹袭击(数学+凸包+单调栈)

    题目背景 $Guess$准备向敌军阵地发起进攻了!$Guess$的武器是自动制导导弹.然而在机房是不允许游戏的,所以班长$XZY$对游戏界面进行了降维打击,结果... 题目描述 众所周知,环境因素对导 ...

  6. linux 挂载磁盘指令

    fdisk -l    (先df -h,如果没有xvdb盘信息,则敲这条指令) fdisk /dev/xvdb (进入对话状态,一问一答,结束后要保存w或者删除q) mkfs.ext3 /dev/xv ...

  7. 20175221曾祥杰 实验三《敏捷开发与XP实践》

    实验三<敏捷开发与XP实践> 实验报告封面 课程:Java程序设计 班级:1752班 姓名:曾祥杰 学号:20175221 指导教师:娄嘉鹏 实验日期:2019年4月30日 实验时间:13 ...

  8. Android传感器系统架构【转】

    本文转载自:http://blog.csdn.net/qianjin0703/article/details/5942579 版权声明:本文为博主原创文章,未经博主允许不得转载. 1. 体系结构 2. ...

  9. Linux内核调试方法总结之strace

    strace [用途] strace是一个功能强大的调试.分析.诊断工具,跟踪程序或进程执行时的系统调用和所接收的信号.可将所调用的系统调用的名称.参数和返回值输出到标准输出或者输出到-o指定的文件. ...

  10. mysqldump常用使用

    1:导出数据库sakila的表结构mysqldump -uroot -ppwd -d sakila > /data/tmp/sakila.sql; 2:导出数据库sakila下表employee ...