用frameset实现左边导航，右边显示相应内容的布局

最新推荐文章于 2023-10-17 17:30:11 发布

_zshuo

最新推荐文章于 2023-10-17 17:30:11 发布

阅读量1.6w

点赞数 12

分类专栏： js 文章标签：导航span idtransmarksp wspan idtransmarkspa

本文链接：https://blog.csdn.net/zhengshuoa/article/details/52173752

版权

js 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

建立3个web页面，Main.jsp, Left.jsp, Right.jsp.

其中，Main.jsp是容器，里面放置了2个frame,分别用来存放导航页（Left.jsp) 和右边的内容页(Right.jsp)。

Main.jsp的前台代码：

<html>

<frameset cols="120,*">

  <frame src="left.jsp">
  <frame src="right.jsp" name="rightframe">

</frameset>

</html>

Left.jsp导航页代码

<html>
<body>

<a href ="a.html" target ="rightframe">Frame a</a><br />
<a href ="b.html" target ="rightframe">Frame b</a><br />
<a href ="c.html" target ="rightframe">Frame c</a>

</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

_zshuo

关注关注

12
点赞
踩
33

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

如何做一个左侧导航栏右侧显示具体消息的html

weijunbaoshuai的博客

07-29

1万+

如果你想做一个这样的东西，左侧分类，比如有分类1，下面的子标题1.1,1.2，1.3等等，然后分类2，下面有相应的子标题。点击不同的子标题右边就会出现相应的界面。我在网上查了查别人怎么做的，然后结合了自己的一些想法，做出来现在的这个东西。 jsp： <div style="height: 400px;"> <div class="title">...

html5使用框架页面布局,HTML框架集与布局

weixin_35578185的博客

06-07

4653

html的框架详解和布局什么是框架？框架将浏览器划分成不同的部分，每一部分加载不同的页面，实现在同一浏览器窗口中加载多个页面的效果划分框架标记语法格式lt;framesetgt;....HTML框架集我们可以通过框架，在一个浏览器窗口中显示多个页面。HTML框架集的使用十分简单，我们需要用到如下2个标签：frameset的属性frameset主要有以下属性：rowscolsboede...博文来自...

参与评论您还未登录，请先登录后发表或查看评论

html左侧导航栏右侧显示内容

无心

08-02

2万+

效果图代码复制下来直接运行就可以 <!doctype html> <html lang = "en"> <head> <meta charset = "UTF-8"> <meta name = "viewport" content = "width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.

左侧导航栏右侧内容

weixin_53715817的博客

07-13

4136

菜单与内容联动，实现左侧三级菜单并且点击左侧导航栏菜单跳转对应页面

左侧导航右侧显示内容 php,html – 侧栏导航和右侧显示内容

weixin_42310670的博客

03-19

515

为标签略微调整标记,并将标识更改为类以进行样式设置：City GalleryLondonParisLondonLondon is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitant...

记录原生html+js实现左侧导航栏右侧内容页

热门推荐

huyishero的博客

01-11

4万+

在项目中，需要实现点击左侧栏目的条目，右侧的内容随之改变。这里使用iframe实现先写一个列表用于显示左侧的条目  <div class="main_left" style="height:100%"> <ul> <li data-src="roa...

页面布局frameset

06-18

这种布局技术允许网页被分割成多个独立的区域，每个区域可以加载不同的网页内容，从而实现内容的并列展示。 `<frameset>`标签在HTML4中被广泛使用，但在HTML5中已被废弃，因为现代网页设计倾向于使用更灵活、可访问...

frameSet应用子父窗口传值

05-03

本篇文章将详细讲解如何在`frameSet`环境下进行子父窗口间的通信以及如何通过点击左边的导航栏来更新右边的内容。 ### 1. `<frameset>`基本结构 `<frameset>`元素定义了浏览器窗口应该如何被分割。它包含零个或多...

Javascript，Html，Css，Frame框架整合的菜单样式

04-01

例如，一个网页可能包含一个顶部帧，显示导航菜单，一个左侧帧，显示目录，而主要内容则在右侧帧中显示。总结起来，"Javascript，Html，Css，Frame，Frameset框架整合的菜单"是网页开发中的常见技术，它们共同作用...

html的frameset和target的应用

09-26

结合`<frameset>`和`<target>`，可以实现复杂的网页布局和导航。例如，可以创建一个带有侧边栏导航的页面布局，其中链接点击后在主要内容区域动态更新： ```html <!DOCTYPE html> <title>Frameset与Target应用 ...

html5左侧边导航右边显示页面,bootstrap如何实现左侧导航栏右侧网页

weixin_29579377的博客

06-02

6481

方式一：采用iframe,即将网页放入iframe这个容器中。方式二：采用div的话绑定a或者li的点击事件阻止a的默认行为，用jquery的load()可以来加载这个div，即将网页放入div中。方式三：angular的嵌套路由也可以实现。不过本人对angular不是很了解，所以这种方式没有去试。方式四：采用ajax技术，实现局部刷新。(本人觉得该方式比较麻烦，就不在这细说了)。二者的实现方式...

HTML左边图片右边导航栏,（1）HTML5+CSS：左边导航栏，右边是对应的文本区域

weixin_39622562的博客

06-04

555

htmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">test#list1a:hover{color:#CC0033;}#list2a:hover{color:#CC0033;}/*#list2a:active{colo...

HTML5 实现左边单击链接时，右边显示内容

分享我的点点滴滴，在成长路上与你同行！

12-13

6392

效果: <style type="text/css"> p,ul,li,div,a { margin: 0px; padding: 0px; } #dd { /*大小*/ width: 100%; height: 300px; } ul { /*左边导航*/ width: ...

如何使用frame框架，将左边视为导航栏，右边作为链接界面

jingke_1524的博客

05-19

5980

在浏览网页时，我们经常会看到一个导航条，当点击导航条上的项目时，相应网页会在显示区域变换显示。那么如何将一个界面中，左边设置为导航栏，点击项目链接，则右边显示相应的内容呢？使用frameset框架，并且设置链接标签<a>的target属性即可。首先我们使用frame将主界面划分为3块，具体代码如下： <!DOCTYPE html> <html> &lt...

左栏导航右栏内容显示

runner_123的博客

04-14

6716

一、核心iframe方法一：改变元素显示、隐藏状态<div style="width: 20%; float: left"> <div id="butten" style="cursor: pointer;"> 左栏导航一 </div> <div id="hidden" >

网页设计，本页面内左侧菜单导航右侧显示内容简单实现方法

qq_27131259的博客

10-10

1万+

首页基本信息休假记录加班记录资质记录合同记录 // 是一种简单实现，一个页面内的两个div，一个里面是菜单，一个里面放置iframe，实现了加入菜单链接后跳转到本页面的div里面

html左侧导航右侧内容,HTML5+CSS：左边导航栏，右边是对应的文本区域

weixin_35861708的博客

05-30

4730

htmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">test#left,#right{float:left;color:#FF33CC;}#right{padding:10px;margin-top:40px;}body{f...

html左侧导航栏iframe模板,用DIV怎么实现框架的效果，就是点左边的导航栏，在右边显示内容，不用iframe的话，该怎么实现呢...

weixin_35719402的博客

06-01

4万+

慕标0481585https://www.imooc.com/search/wenda?words=%E4%B8%80%E8%88%AC%E6%89%93%E5%BC%B9%E5%BC%93%E7%94%A8%E5%87%A0%E6%AF%AB%E7%B1%B3%E5%BC%B9%E7%8F%A0%E5%A5%BD%E7%94%A8%E3%80%906499%2B5331%27q%E3%80%91...

jsp：用frameset实现页面左边是表单，右边是表单提交的数据

06-10

您好，使用`frameset`实现页面左边是表单，右边是表单提交的数据，可以参考以下代码： ```html <!DOCTYPE html> <html> <head> <title>Frameset Example</title> </head> <frameset cols="50%,50%"> <frame src="form.html" name="formFrame"> <frame src="submit.html" name="submitFrame"> </frameset> </html> ``` 其中，`cols="50%,50%"`表示左边和右边各占50%的宽度。然后，在`form.html`中编写表单代码，例如： ```html <!DOCTYPE html> <html> <head> <title>Form Example</title> </head> <body> <form action="submit.html" method="post" target="submitFrame"> <label for="name">Name:</label> <input type="text" id="name" name="name"><br><br> <label for="email">Email:</label> <input type="email" id="email" name="email"><br><br> <input type="submit" value="Submit"> </form> </body> </html> ``` 在`submit.html`中编写表单提交后显示数据的代码，例如： ```html <!DOCTYPE html> <html> <head> <title>Submit Example</title> </head> <body> <h1>Submitted Data:</h1> <p>Name: <?php echo $_POST['name']; ?></p> <p>Email: <?php echo $_POST['email']; ?></p> </body> </html> ``` 这里使用了PHP语言来获取表单提交的数据，并在页面上显示出来。注意，`form`标签的`action`属性指定了表单提交到`submit.html`页面，`target`属性指定了表单提交后在哪个`frame`中显示结果。希望能对您有所帮助！