html框架点击左边目录内容显示在右边框架里

最新推荐文章于 2023-08-18 14:41:31 发布

可怜少年秃了头

最新推荐文章于 2023-08-18 14:41:31 发布

阅读量3.7k

点赞数 5

分类专栏：笔记

本文链接：https://blog.csdn.net/qq_46133630/article/details/109539401

版权

笔记专栏收录该内容

1 篇文章 0 订阅

订阅专栏

html框架点击左边目录内容显示在右边框架定义框架为目录标题内容这三个框架，我们点击左边的目录，目录里面的内容会出现在内容这个框架里看下边怎么操作。

先创建第一个index.html文件，代码如下:

<!DOCTYPE html>
<html>
<head><meta charset="utf-8">
<title>index</title>
</head>
<frameset cols="20%,80%"><!--定义页面左边分20%右边分80%-->
<frame src="目录.html"name="left"><!--定义左边框架使用文件为目录.html框架的名字为lefr--><frameset rows="20%,80%"><!--定义右边80%分为上下两个框架一个20%一个80%-->
<frame src="标题.html" name="rightup"><!--80％中上边20%给标题.html文件使用，框架名字为rightup-->
<frame src="内容.html"name="rightdown"><!--80%中下边80％给内容.html文件使用,框架名字为rightdown-->
</frameset>
</frameset>
</html>

然后创建目录.html文件，代码如下:

<!DOCTYPE html>
<html>
  <head>
	<meta charset="utf-8">
	<title>目录</title>
  </head>
  <body>
  <h1>目录</h1>	
	<a href="内容1.html"target="rightdown">内容1</a><br> <!--将内容1文件的内容指定显示给名为rightdown的框架-->
 <a href="内容2.html"target="rightdown">内容2</a><br> <!--将内容2文件的内容指定显示给名为rightup的框架-->
  </body><!--上边的target为指定-->
</html>

创建标题.html代码如下:

<!DOCTYPE html>
<html>
  <head>
	<meta charset="utf-8" >
	<title>标题</title>
  </head>
  <body>	
	<h1>框架点击目录框架，显示在内容框架</h1> </body>
</html>

创建内容.html，代码如下:

<!DOCTYPE html>
<html>
  <head>
	<meta charset="utf-8">
	<title>内容</title>
  </head>
  <body>	
	请认真看注释！
  </body>
</html>

创建内容1.html这个文件需要点击目录才会显示代码如下:

<html>
 <head> 
  <meta charset="utf-8"> 
  <title>内容1</title> 
 </head> 
 <body > 
 我是御雪
  </body>
</html>

创建内容2.html意思同上，代码如下:

<!DOCTYPE html>
<html>
  <head>
	<meta charset="utf-8">
	<title>内容2</title>
  </head>
  <body>	
	csdn
  </body>
</html>

到这里就结束了！

可怜少年秃了头

关注

5
点赞
踩
32

收藏

觉得还不错? 一键收藏
0
评论
html框架点击左边目录内容显示在右边框架里

html框架定义框架为目录标题内容这三个框架，我们点击左边的目录，目录里面的内容会出现在内容这个框架里看下边怎么操作。先创建第一个index.html文件，代码如下:<!DOCTYPE html><html><head><meta charset="utf-8"><title>index</title></head><frameset cols="20%,80%"><!--定义页面左
复制链接

扫一扫