frameset
刚刚快速帮别人做了一个frameset。以后不想再做了。就copy上来咯。^_^
frameset.html
<html>
<head>
<title>框架菜单</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<!-- 框架开始 -->
<frameset rows="218*,239*" cols="*" framespacing="0" frameborder="NO" border="1" >
<frame src="top.html" name="topFrame" scrolling="NO" noresize/>
<frameset rows="*" cols="250,500,250" framespacing="0" frameborder="NO">
<frame src="left.html" name="leftFrame" scrolling="NO" noresize/>
<frame src="main.html" name="mainFrame" scrolling="no" noresize/> <!-- scrolling 框架滚动条显示 yes/no （可视化助理） -->
<frame src="right.html" name="rightFrame" scrolling="no" noresize="noresize" />
</frameset>
</frameset>
<!-- 框架结束 -->
<noframes>
<body class="html">
</body>
</noframes>
</html>
left.html
<link href="style.css" rel="stylesheet" type="text/css">
<body leftmargin="0" topmargin="0" class="body">
<table align="right" border="1" width="150" height="600" class="left">
<div id="left">
<h1 class="h1" class="p,pre, h1">左边的菜单</h1>
<p class="p">菜单固定的宽</p>
<pre class="pre"><a href="example.html" target="mainFrame" class="a">select1</a></pre>
<pre class="pre"><a href="test.html" target="mainFrame" class="a">select2</a></pre>
<pre class="pre"><a href="1.html" target="mainFrame" class="a">select3</a></pre>
<pre class="pre"><a href="main.html" target="mainFrame" class="a">select4</a></pre>
</div>
</body>
main.html
<link href="style.css" rel="stylesheet" type="text/css">
<body leftmargin="0" topmargin="0" rightmargin="0">
<table align="center" border="1">
<!-- div main-->
<div id="main" class="content">
<h1 class="h1">中间</h1>
<p class="h1">
</p>
<pre class="pre"></pre>
</div>
</table>
</body>
right.html
<link href="style.css" rel="stylesheet" type="text/css">
<body leftmargin="0" topmargin="0" rightmargin="0" class="right">
<table align="left" border="1" width="150" height="600">
<div id="right" class="right">
<h1 class="h1">右边</h1>
<pre class="pre"></pre>
<p class="p">
<img src="xhtml10.gif" alt="" width="80" height="15" border="0"/><br/>
<img src="css.gif" alt="css" width="80" height="15" border="0"/><br />
</p>
</div>
<br clear="all" />
</div>
</table>
</body>
top.html
<link href="style.css" rel="stylesheet" type="text/css">
<table width="850" height="150" border="1" align="center" class="head">
<div id="top"><a class="a">上面</a></div>
</table>
style.css
@charset "utf-8";
/* CSS Document */
<!-- css -->
<style type="text/css" media="screen"><!--
/* body 中的标签元素css定义 */
/* html模版定义 */
html {
padding:0px;
margin:0px;
}
body {
background-color: #e1ddd9;
font-size: 12px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#564b47;
text-align:center;
margin:0px;
padding:0px;
}
p,pre, h1 {
margin:0px 10px 10px 10px;
}
h1 {
font-size:14px;
padding-top:10px;
text-transform:uppercase;
color: #564b47;
background-color: transparent;
}
a {
color: #ff66cc;
font-size: 11px;
background-color:transparent;
text-decoration: none;
}
pre {
color: #564b47;
font-size: 11px;
background-color:transparent;
font-family: Courier, Monaco, Monospace;
}
/* 布局层次修饰 */
#box {
width:750px;
margin: 0px auto;
padding:0px;
text-align:left;
}
#left {
width:175px;
padding:0px;
float:left;
background-color:#ff99cc;
}
#content {
width:400px;
padding:0px;
float:left;
background-color:#fff;
overflow: auto;
}
#right {
width:175px;
padding:0px;
float:left;
background-color:#ff99cc;
}
#head {
background-color:transparent;
}
#head h1 {
font-size: 11px;
text-transform:uppercase;
text-align: right;
color: #564b47;
background-color: #90897a;
padding:5px 15px;
margin:0px
}
#head p {
padding:10px;
margin:0px;
}
--></style>
<!-- css定义结束 -->
引用css style
直接class="未引用..."，引用...，再class＝"你要的形式名称,自己去找"。
