文件包括 main.html  top.html  left.html  childhood.html
 moonsong.html  herethesea.html

主要布局效果:

代码:

main.html

<frameset rows="30%,*"> <!--上面部分-->
<frame src="top.html" scrolling="no">
<frameset cols="20%,*" > <!--以下80%分为左右部分-->
<frame src="left.html" noresize frameborder="1"/ scrolling="no">
<frame src="right.html" name="myframe" noresize frameborder="1"/>
</frameset>
</frameset>

top.html

<meta http-equiv="content-type" content="text/html;charset=UTF-8"/>
<body>
<table align="center" boder="0px" width="100%" height="200px" background="topJpg.jpg" cellspacing="0px" cellspading="0px">
<tr></tr>
</table>
</body>

left.html

<meta http-equiv="content-type" content="text/html;charset=UTF-8"/>
<body bgcolor="lightblue">
<center>
</center>
<!--target 点击后的目标-->
<ul>
<li><a href="herethesea.html" target="myframe">最重要的决定</a></li>
<li><a href="childhood.html" target="myframe">下沙</a></li>
<li><a href="moonsong.html" target="myframe">与半小夜曲</a></li>
</ul>
</body>

right.html

<meta http-equiv="content-type" content="text/html;charset=UTF-8"/>
<body bgcolor="silver">
歌词
</body>

歌词略..

html-上左右布局方式---ShinePans的更多相关文章

  1. Android开发之基本控件和详解四种布局方式

    Android中的控件的使用方式和iOS中控件的使用方式基本相同,都是事件驱动.给控件添加事件也有接口回调和委托代理的方式.今天这篇博客就总结一下Android中常用的基本控件以及布局方式.说到布局方 ...

  2. Android入门(十):界面的布局方式及其实际应用

    关于Android界面布局,网上已经有了很多非常不错的学习资料,在这里我也不班门弄斧了,推荐两篇我认为写的不错的教程,然后再重点讲一下几种布局方式的实际应用. 教程链接:①http://www.cnb ...

  3. 【Android UI】Android开发之View的几种布局方式及实践

    引言 通过前面两篇: Android 开发之旅:又见Hello World! Android 开发之旅:深入分析布局文件&又是“Hello World!” 我们对Android应用程序运行原理 ...

  4. 对比MFC资源文件谈谈WPF布局方式

    对比MFC资源文件谈谈WPF布局方式 MFC方式 对于传统的MFC基于UI的应用程序设计通常分两步走,首先是设计UI,使用的是RC文件,然后是代码文件,对RC文件进行操作,如下面Figure 1 的基 ...

  5. Android 开发之旅:view的几种布局方式及实践

    本文的主要内容就是分别介绍以上视图的七种布局显示方式效果及实现,大纲如下: 1.View布局概述 2.线性布局(Linear Layout) 2.1.Tips:android:layout_weigh ...

  6. Android 开发:view的几种布局方式及实践

    View的几种布局显示方法,以后就不会在针对布局方面做过多的介绍.View的布局显示方式有下面几种:线性布局(Linear Layout).相对布局(Relative Layout).表格布局(Tab ...

  7. 自定义UICollectionViewController之后 如何设置UICollectionView的布局方式

    我们很多时候使用UICollectionView 可能都是直接创建 UICollectionView   通过初始化的时候  传入一个布局对象的方式来使用UICollectionView 比如我们之前 ...

  8. 五大Android布局方式浅析

    Android布局是应用界面开发的重要一环,在Android中,共有五种布局方式,分别是:FrameLayout(框架布局),LinearLayout (线性布局),AbsoluteLayout(绝对 ...

  9. Android学习笔记④——页面的布局方式

    FrameLayout(帧布局) 这个布局的特点是简单的默认把每一个视图组件都放在边框内且放在左上角,即使添加多个视图组件,他们也都是重叠在左上角,新的视图会遮挡住旧的视图.可以根据gravity来改 ...

随机推荐

  1. Java并发和多线程2:3种方式实现数组求和

    本篇演示3个数组求和的例子. 例子1:单线程例子2:多线程,同步求和(如果没有计算完成,会阻塞)例子3:多线程,异步求和(先累加已经完成的计算结果) 例子1-代码 package cn.fansuni ...

  2. visual studio 2015将已有项目添加到码云(gitee)

    visual studio 2015将已有项目添加到码云的步骤包括:gitee新建项目.清空项目及VS发布项目 1.gitee新建项目 2.清空项目 清空项目则会将vs项目的master分支发布到gi ...

  3. linux内核(四)内存管理单元MMU

    1,基本概念 一个程序运行时没必要全部都同时装入内存,只需要把当前需要运行的部分装入内存即可,这样就使得一个大程序可以在较小的内存中运行,也使得内存中可以同时装入更多的程序并发执行,从用户角度看,该系 ...

  4. 判断QString是否为纯数字,查找自身最长重复子字符串

    1.判断QString是否为纯数字 bool IsDigitString(QString strSource) { bool bDigit = false; if (strSource.isEmpty ...

  5. Android应用内加载pdf的方法?

    [可行] 最直接的方式下载到本地, 然后调用相关应用打开 [可行,有局限] 使用 webview 加载, 需要在 原url 前面加上 http://docs.google.com/gview?url= ...

  6. 无法连接虚拟设备 ide1:0,因为主机上没有相应的设备。您要在每次开启此虚拟机时都尝试连接此虚拟设备吗?

    转自:http://blog.51cto.com/thawliu/1704876 安装虚拟机时出现提示:无法连接虚拟设备 ide1:0,因为主机上没有相应的设备.您要在每次开启此虚拟机时都尝试连接此虚 ...

  7. 89.[NodeJS] Express 模板传值对象app.locals、res.locals

    转自:https://blog.csdn.net/Elliott_Yoho/article/details/53537437 locals是Express应用中 Application(app)对象和 ...

  8. su和sudo的区别与使用,su命令,linux命令

    su和sudo的区别与使用 一.   使用 su 命令临时切换用户身份 1. su 的适用条件和威力 su命令就是切换用户 的工具,怎么理解呢?比如我们以普通用户beinan登录的,但要添加用户任务, ...

  9. 计算sigma

    1.计算平均值Avg Avg = (a0 + a1 + ......+ an-1) / n 2.计算sigma sigma = sqrt( ( (a0-avg) ^2   + (a1-avg) ^2 ...

  10. Android View 上下左右四种间距的设置方法

    RecyclerView控件大家肯定不陌生,已经应用有一段时间了,最近在项目中写一个GridLayout样式的RecyclerView时需要设置,item之间左右的间距,下面是我总结的一个设置间距的方 ...