📄 frame.html
字号:
<HTML>
<HEAD>
<TITLE>清华大学图书馆主页 - INTERNET 教室 - HTML 语言教程</TITLE>
</HEAD>
<BODY BGCOLOR="#D4D4D4">
<H1 ALIGN=CENTER>多窗口页面(Frames)</H1>
<CENTER><P>
<HR></P></CENTER>
<P><!--################## Frame ########################--><A NAME="frame"></A></P>
<H2><IMG SRC="br20t.gif" ALT="+" HEIGHT=20 WIDTH=20 ALIGN=TOP> 基本语法
</H2>
<P><!------Basic-------></P>
<H3><frameset> ... </frameset><BR>
<frame src="url"> <BR>
<noframes> ... </noframes></H3>
<P>在 <noframes> 标记后的文字将只出现在不支持 FRAMES 的浏览器中。</P>
<PRE> <HTML>
<HEAD>
</HEAD>
<FRAMESET>
<FRAME SRC="url">
<NOFRAMES> ... </NOFRAMES>
</FRAMESET>
</HTML></PRE>
<P><!--################## Size ########################--><A NAME="size"></A></P>
<H2><IMG SRC="br20t.gif" ALT="+" HEIGHT=20 WIDTH=20 ALIGN=TOP> 各窗口的尺寸设置
</H2>
<P><!------COLS-------></P>
<H3><frameset cols=#></H3>
纵向排列多个窗口：
<DL>
<PRE><frameset cols=30%,20%,50%>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>
<A HREF="frame/cols.html"><FONT SIZE=+2>示例</FONT></A>
</PRE>
</DL>
<TABLE WIDTH="100" HEIGHT="120" >
<TR>
<TD width=30 align=center>A </TD>
<TD width=20 align=center>B </TD>
<TD width=50 align=center>C </TD>
</TR>
</TABLE>
<PRE>
</PRE>
<P><!------ROWS-------></P>
<H3><frameset rows=#></H3>
横向排列多个窗口：
<DL>
<PRE><frameset rows=25%,25%,50%>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>
<A HREF="frame/rows.html"><FONT SIZE=+2>示例</FONT></A>
</PRE>
</DL>
<TABLE WIDTH="100" HEIGHT="120" >
<TR>
<TD height=30 align=center>A </TD>
</TR>
<TR>
<TD height=30 align=center>B </TD>
</TR>
<TR>
<TD height=60 align=center>C </TD>
</TR>
</TABLE>
<PRE>
</PRE>
<P><!------COLS & ROWS-------></P>
<H3>COLS & ROWS</H3>
纵横排列多个窗口：
<DL>
<PRE><frameset cols=20%,*>
<frame src="A.html">
<frameset rows=40%,*>
<frame src="B.html">
<frame src="C.html">
</frameset>
</frameset>
<A HREF="frame/row_col.html"><FONT SIZE=+2>示例</FONT></A>
</PRE>
</DL>
<TABLE WIDTH="100" HEIGHT="120" >
<TR>
<TD rowspan=2 align=center width=20>A </TD>
<TD align=center height=48 width=80>B </TD>
</TR>
<TR>
<TD align=center height=72 width=80>C </TD>
</TR>
</TABLE>
<PRE>
</PRE>
<P><!------No Resize-------></P>
<H3>不允许各窗口改变大小 <frame noresize></H3>
<DL>
<DD>缺省设置是允许各窗口改变大小的。</DD>
</DL>
<PRE>
</PRE>
<P><!--################## Frame Target ########################--><A NAME="target"></A></P>
<H2><IMG SRC="br20t.gif" ALT="+" HEIGHT=20 WIDTH=20 ALIGN=TOP> 各窗口间相互操作(Frame Target)
</H2>
<P><!------NAME-------></P>
<H3>窗口标识(Frame Name) <BR>
<frame name=#><BR>
<a href=url target=#> </H3>
<DL>
<PRE><frameset cols=50%,50%>
<frame src="A.html">
<frame src="B.html" name="HELLO">
</frameset>
<A HREF="frame/target.html"><FONT SIZE=+2>示例</FONT></A>
</PRE>
</DL>
<TABLE WIDTH="100" HEIGHT="120" >
<TR>
<TD width=50% align=center>A </TD>
<TD width=50% align=center>B </TD>
</TR>
</TABLE>
<P><!------Special Target-------></P>
<FONT COLOR=RED SIZE=+2>特殊的 4 类操作(很有用喔)</FONT><BR>
<H3>
<a href=url target=_blank> 新窗口<BR>
<a href=url target=_self> 本窗口<BR>
<a href=url target=_parent> 父窗口<BR>
<a href=url target=_top> 整个浏览器窗口</H3>
<P><A HREF="frame/target01.html"><FONT SIZE=+2>示例</FONT></A> </P>
<PRE>
</PRE>
<P><!--################## Frame Appearance ########################--><A NAME="appear"></A></P>
<H2><IMG SRC="br20t.gif" ALT="+" HEIGHT=20 WIDTH=20 ALIGN=TOP> Frame 的外观(Appearance)
</H2>
<P><!------BORDER-------></P>
<H3>各窗口边框的设置 <frame frameborder=#> #=yes, no / 1, 0</H3>
<DL>
<PRE><frameset rows=30%,*>
<frame src="Acol.html" frameborder=1>
<frameset cols=30%,*>
<frame src="Bcol.html" frameborder=0>
<frame src="Ccol.html" frameborder=0>
</frameset>
</frameset>
<A HREF="frame/border.html"><FONT SIZE=+2>示例</FONT></A>
</PRE> (A 有边框，B、C 没有)
</DL>
<TABLE WIDTH="100" HEIGHT="120" frame="box" rules="rows" >
<TR>
<TD height=36 colspan=2 align=center bgcolor=3333ff>A </TD>
</TR>
<TR>
<TD height=84 width=30 align=center bgcolor=9999ff>B </TD>
<TD height=84 width=70 align=center bgcolor=ffffff>C </TD>
</TR>
</TABLE>
<P><!------Frame Spacing-------></P>
<H3>各窗口间空白区域的设置 <BR>
<frameset framespacing=#> #=空白区域的大小 <IMG SRC="ie.gif" HEIGHT=14 WIDTH=80></H3>
<DL>
<PRE><frameset rows=30%,* framespacing=100>
<frame src="Acol.html">
<frameset cols=30%,*>
<frame src="Bcol.html">
<frame src="Ccol.html">
</frameset>
</frameset>
<A HREF="frame/space.html"><FONT SIZE=+2>示例</FONT></A>
</PRE>
</DL>
<TABLE CELLSPACING=10 WIDTH="100" HEIGHT="120" >
<TR>
<TD height=36 colspan=2 align=center bgcolor=3333ff>A </TD>
</TR>
<TR>
<TD height=84 width=30 align=center bgcolor=9999ff>B </TD>
<TD height=84 width=70 align=center bgcolor=ffffff>C </TD>
</TR>
</TABLE>
<P><!------Border Color-------></P>
<H3>边框色彩 <frameset bordercolor=#> <IMG SRC="netscape.gif" HEIGHT=14 WIDTH=80></H3>
<DL>
<DD>#=rrggbb 16 进制 RGB 数码, 或者是下列预定义色彩名称：<BR>
<FONT COLOR="#000000">Black</FONT>, <FONT COLOR="#808000">Olive</FONT>,
<FONT COLOR="#008080">Teal</FONT>, <FONT COLOR="#FF0000">Red</FONT>, <FONT COLOR="#0000FF">Blue</FONT>,
<FONT COLOR="#800000">Maroon</FONT>, <FONT COLOR="#000080">Navy</FONT>,
<FONT COLOR="#808080">Gray</FONT>, <FONT COLOR="#00FF00">Lime</FONT>, <BR>
<FONT COLOR="#FF00FF">Fuchsia</FONT>, <FONT COLOR="#FFFFFF">White</FONT>,
<FONT COLOR="#008000">Green</FONT>, <FONT COLOR="#800080">Purple</FONT>,
<FONT COLOR="#C0C0C0">Silver</FONT>, <FONT COLOR="#FFFF00">Yellow</FONT>,
<FONT COLOR="#00FFFF">Aqua</FONT> </DD>
</DL>
<DL>
<PRE><frameset rows=30%,* bordercolor=red>
<frame src="Acol.html">
<frameset cols=30%,*>
<frame src="Bcol.html">
<frame src="Ccol.html">
</frameset>
</frameset>
<A HREF="frame/color.html"><FONT SIZE=+2>示例</FONT></A>
</PRE>
</DL>
<TABLE WIDTH="100" HEIGHT="120" BGCOLOR="#FF0000" bordercolor="red" >
<TR>
<TD height=36 colspan=2 align=center bgcolor=3333ff>A </TD>
</TR>
<TR>
<TD height=84 width=30 align=center bgcolor=9999ff>B </TD>
<TD height=84 width=70 align=center bgcolor=ffffff>C </TD>
</TR>
</TABLE>
<P><!------MARGIN-------></P>
<H3>页面空白(Margin) <frame marginwidth=# marginheight=#></H3>
<DL>
<PRE><frameset cols=50%,50%>
<frame src="A.html">
<frame src="A.html"
marginwidth=50
marginheight=50>
</frameset>
<A HREF="frame/margin.html"><FONT SIZE=+2>示例</FONT></A>
</PRE>
</DL>
<TABLE WIDTH="100" HEIGHT="120" border>
<TR>
<TD width=50 align=center>AAAA </TD>
<TD width=50 align=center>AA<BR>
AA </TD>
</TR>
</TABLE>
<P><!------SCROLLBAR-------></P>
<H3>卷滚条设置 <frame scrolling=#> #=yes, no, auto</H3>
<DL>
<DD>#=缺省值是 auto。 </DD>
</DL>
<PRE>
</PRE>
<P><!--################## Floating Frame ########################--><A NAME="float"></A></P>
<H2><IMG SRC="br20t.gif" ALT="+" HEIGHT=20 WIDTH=20 ALIGN=TOP> 浮动窗口(Floating Frame)<IMG SRC="ie.gif" HEIGHT=14 WIDTH=80></H2>
<P><!------Floating Frame-------></P>
<H3><iframe src=# name=##> ... </iframe> <BR>
#=初始页面的 URL<BR>
##=<A HREF="#target">窗口标识</A>(Frame Name)<FONT SIZE=+0>(之后可对此标识进行<A HREF="#target">各窗口间相互操作</A>)<BR>
</FONT>... = 此处文字将只出现在不支持 FRAMES 的浏览器中。</H3>
<DL>
<PRE><center>
<iframe src="A.html" name="window">
Here is a Floating Frame
</iframe>
<br><br>
<a href="A.html" target="window">Load A</A><BR>
<a href="B.html" target="window">Load B</A><BR>
<a href="Ccol.html" target="window">Load C</A><BR>
</center>
<A HREF="frame/iframe.html"><FONT SIZE=+2>示例</FONT></A>
</PRE>
</DL>
<TABLE WIDTH="100" HEIGHT="120" >
<TR>
<TD>
<CENTER><TABLE WIDTH="50" HEIGHT="30" >
<TR>
<TD>Display A.html </TD>
</TR>
</TABLE></CENTER>
<P><BR>
<U>Load A<BR>
Load B<BR>
Load C</U><BR>
</P>
</TD>
</TR>
</TABLE>
<PRE>
</PRE>
<P><!--################## (^^) Jump & Add (^^) ########################-->
<HR><A HREF="http://ncdesign.kyushu-id.ac.jp/"><IMG SRC="angel-homeg.gif" ALT="NCD HOME" HSPACE=3 VSPACE=10 BORDER=0 HEIGHT=46 WIDTH=55 ALIGN=LEFT></A>
<B><A HREF="../html_design.html">HTML
Design Guide Main Page<BR>
<NOBR></A></B><FONT FACE="'Times New Roman', Arial"><FONT SIZE=-1><A HREF="html_design.html#content">Contents</A>
|| <A HREF="page.html">Page</A>
|| <A HREF="font.html">Font</A>
|| <A HREF="text_style.html">Text
Style</A> || <A HREF="image.html">Image</A>
|| <A HREF="form.html">Form</A>
|| <A HREF="table.html">Table</A>
|| <A HREF="table02.html">Table
Advanced</A> <BR>
|| <A HREF="frame.html">Frames</A>
|| <A HREF="marquee.html">Marquee</A>
|| <A HREF="inline.html">Alternative
Inline Elements</A> <BR>
</FONT><FONT SIZE=-2><A HREF="tag-index.html">Tag
Index</A> || <A HREF="new.html">What's
New</A></FONT><FONT SIZE=-1> </FONT></FONT><BR clear=all>
</P>
<P>Network Communication Design<BR>
<A HREF="http://ncdesign.kyushu-id.ac.jp/">http://ncdesign.kyushu-id.ac.jp/<BR>
</A>C&P 1994-1996 Yuriko Ienaga <FONT SIZE=-1><A HREF="mailto:v91102@vgenda.kyushu-id.ac.jp">v91102@vgenda.kyushu-id.ac.jp</A></FONT>
<!--################## (^^) END (^^) ########################--></P>
</BODY>
</HTML>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -