Frames

HTML Design Guide - Table v3.0


+ Frame Basic

<frameset> ... </frameset>
<frame src="url">
<noframes> ... </noframes>

HTML document included in <noframes> are for browsers not supported frames.

<HTML>
<HEAD>
</HEAD>
<FRAMESET>
<FRAME SRC="url">
<NOFRAMES> ... </NOFRAMES>

</FRAMESET>
<HTML>



+ Frame Size

<frameset cols=#>

A B C
<frameset cols=30%,20%,50%>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>

Sample Page


<frameset rows=#>

A
B
C
<frameset rows=25%,25%,50%>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>

Sample Page


COLS & ROWS

A B
C
<frameset cols=20%,*>
<frame src="A.html">
     <frameset rows=40%,*>
     <frame src="B.html">
     <frame src="C.html">
     </frameset>
</frameset>

Sample Page


No Resize <frame noresize>

Default frame is resizable.


+ Frame Option

Frame Name
<frame name=#>
<a href=url target=#>

A B
<frameset cols=50%,50%>
<frame src="A.html">
<frame src="B.html" name="HELLO">
</frameset>

Sample Page

Special Target
<a href=url target=_blank>
<a href=url target=_self>
<a href=url target=_parent>
<a href=url target=_top>

Sample Page



+ Frame Appearance

Frame Border <frame frameborder=#> #=yes, no

A
B C
<frameset rows=30%,*>
<frame src="Acol.html" frameborder=no>
<frameset cols=30%,*>
     <frame src="Bcol.html" frameborder=no>
     <frame src="Ccol.html" frameborder=no>
</frameset>
</frameset>

Sample Page

Frame Spacing <frameset framespacing=#> #=Space Size

A
B C
<frameset rows=30%,* framespacing=100>
<frame src="Acol.html">
<frameset cols=30%,*>
     <frame src="Bcol.html">
     <frame src="Ccol.html">
</frameset>
</frameset>

Sample Page

Border Color <frameset bordercolor=#>

#=rrggbb Hex Number, or Name:
Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,
Fuchsia, White, Green, Purple, Silver, Yellow, Aqua
A
B C
<frameset rows=30%,* bordercolor=red>
<frame src="Acol.html">
<frameset cols=30%,*>
     <frame src="Bcol.html">
     <frame src="Ccol.html">
</frameset>
</frameset>

Sample Page

Margin <frame marginwidth=# marginheight=#>

AAAA AA
AA
<frameset cols=50%,50%>
<frame src="A.html">
<frame src="A.html" 
    marginwidth=50 
    marginheight=50>
</frameset>

Sample Page


Scrollbar <frame scrolling=#> #=yes, no, auto

#=auto is a default.


+ Floating Frame

<iframe src=# name=##> ... </iframe>
#=URL
#=Frame Name (as same as Frame Target)
... = html source for non supported browser

Display A.html


Load A
Load B
Load C

<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>

Sample Page



NCD HOME HTML Design Guide Main Page
Contents || Page || Font || Text Style || Image || Form || Table || Table Advanced
|| Frames || Marquee || Alternative Inline Elements
Tag Index || What's New

Network Communication Design
http://ncdesign.kyushu-id.ac.jp/
C&P 1994-1996 Yuriko Ienaga v91102@vgenda.kyushu-id.ac.jp