html-上左右布局方式---ShinePans

文件包含 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>

歌词略..

时间: 2024-11-14 07:13:49

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

[转]企业网站首页设计常见的6种布局方式

在群里和大家交流时,看到太多的网页设计师发布企业站的个人作品,设计中总是摆脱不了大框套小框的设计布局思路,不加思索的跳入单一的网页布局形式中,于是就有了把企业站常用的页面布局方式总结一下的想法,让大家包括我自己全面的了解一下企业站的常见布局方式,做到对此种类型的网站布局心中有数,跳出狭隘.单一的设计思路,于是就有了这篇文章.很多人常常询问某个页面该如何布局这样的问题,其实网页布局也没有想象中那么难,只要做到两点我认为起码可以做到临阵不慌,一是对常见的布局方式心中有数,二是根据信息内容及设计素材的

企业网站首页设计常见的6种布局方式

看到太多的网页设计师发布企业站的个人作品,设计中总是摆脱不了大框套小框的设计布局思路,不加思索的跳入单一的网页布局形式中,于是就有了把企业站常用的页面布局方式总结一下的想法,让大家包括我自己全面的了解一下企业站的常见布局方式,做到对此种类型的网站布局心中有数,跳出狭隘.单一的设计思路,于是就有了这篇文章.很多人常常询问某个页面该如何布局这样的问题,其实网页布局也没有想象中那么难,只要做到两点我认为起码可以做到临阵不慌,一是对常见的布局方式心中有数,二是根据信息内容及设计素材的特点进行摆积木式的多

CSS原生布局方式

前言 网页原生布局的方法其实网上有很多,大概为Flow(流动布局模型).Float(浮动布局模型).Layer(层级布局模型).<!--more--> Flow布局 流动布局模型其实就是默认的网页布局模式.也就是说网页在默认状态下的HTML网页元素都是根据流动模型来分布网页内容的.流动布局将会有两个比较典型的特征,第一,块级元素都会在所处的最近父级容器元素内自上而下按顺序垂直顺延分布,因为在默认状态下,块级元素的宽度都是100%(即父级元素宽度的100%).实际上,块状元素都会以行的形式占据位

Web页面布局方式小结

事实上,本文是在Peter Jerde的How much information can be stored by ordering 52 playing cards文章基础上翻译.改编和扩展而来的.当然这是经过Jerde本人首肯的. 注意本文方法并非最优,也没有完全利用所有的信息空间,只是简单的尝试. 有数字的地方就有信息.所以扑克牌中保存信息不是什么新鲜事. PDF文档点这里:下载 原文(英文)点这里:访问 这里有两个DEMO. 编码DEMO,解码DEMO 首先是"DEEP IN SHALL

Swing的布局方式

  Swing的布局方式 当选择使用JPanel和顶层容器的content pane时,需要考虑布局管理.JPanel缺省是初始化一个FlowLayout,而content pane缺省是初始化一个BorderLayout.下面将分别介绍几种最常用的布局管理器:FlowLayout.BorderLayout.BoxLayout.CardLayout.GridLayout和GridBagLayout. 代码演示每一个布局管理器都会有一个代码演示,xxxLayoutDemo.java(见附件).这些

元素,布局方式,BFC和清除浮动

元素:块级元素,内联元素,内联块状元素 块级元素:在默认情况下会独占一块区域                相对于块级元素的父元素来讲,块级元素占据的行默认是单独享有的.                通过设置元素的样式为: display:block;      可以让元素具有块级样式. 块级元素的特点是:水平拉伸,垂直包裹. 所谓水平拉伸,是相对于块级元素的父元素来说的. 在不设置with属性时,块级元素的width会被水平拉伸,使得width+border+margin等于父元素的widt

Android五种布局方式——LinearLayout、RelativeLayout、TableLayout....(四)

Android五种布局方式--LinearLayout.RelativeLayout .TableLayout.... Android使用XML声明界面布局 将程序的表现层和控制层分离 修改用户界面时,无需更改程序的源代码 可视化工具设计用户界面 Android五种布局方式 LinearLayout线性布局 AbsoluteLayout坐标布局 RelativeLayout相对布局 FrameLayout帧布局 TableLayout表格布局 GridLayout 1.LinearLayout线

【转】Android开发学习笔记:5大布局方式详解

Android中常用的5大布局方式有以下几种: 线性布局(LinearLayout):按照垂直或者水平方向布局的组件. 帧布局(FrameLayout):组件从屏幕左上方布局组件. 表格布局(TableLayout):按照行列方式布局组件. 相对布局(RelativeLayout):相对其它组件的布局方式. 绝对布局(AbsoluteLayout):按照绝对坐标来布局组件. 1. 线性布局 线性布局是Android开发中最常见的一种布局方式,它是按照垂直或者水平方向来布局,通过“android:

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

我们很多时候使用UICollectionView 可能都是直接创建 UICollectionView   通过初始化的时候  传入一个布局对象的方式来使用UICollectionView 比如我们之前是这样写得: 1 UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init]; 2 3 UICollectionView *collection = [[UICollectionView alloc]