1. 程式人生 > >html框架的小實例

html框架的小實例

窗體 運行 ont enter style charset ext 刷新 char

一共分了五個頁面,請將以下頁面保存,存放於同目錄之下,運行查看效果

target
_blank     -- 在新窗口中打開鏈接
_parent    -- 在父窗體中打開鏈接
_self         -- 在當前窗體打開鏈接,此為默認值
_top         -- 在當前窗體打開鏈接,並替換當前的整個窗體(框架頁)

================================== a.html =======================================

<html>
<head>
<title>這是框架頁面</title>
</head>
<frameset rows="50%,50%">
        <frame src="http://pannijingling.blog.163.com/blog/b.html" name=‘top‘>
<frameset cols="25%,75%">
        <frame src="http://pannijingling.blog.163.com/blog/c.html" name=‘left‘>
        <frame src="http://pannijingling.blog.163.com/blog/d.html" name=‘rightfram‘>
</frameset>
</html>

================================== b.html =======================================

<html>
<head>
<title>這是b.html頁面</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style type="text/css">
a:link {
    color: #FF0000;
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #0000FF;
}
a:hover {
    text-decoration: underline;
}
a:active {
    text-decoration: none;
}
</style>
</head>
<body>
<center>
    <a href="http://pannijingling.blog.163.com/blog/e.html" target="rightfram">返回e.html,此種方法只刷新框架
的rightfram部分</a>
    <p><a href="http://pannijingling.blog.163.com/blog/d.html" target="right">返回d.html,此種方法只刷新框架
的right部分</a></P>
    <a href="http://pannijingling.blog.163.com/blog/a.html" target="_parent">返回首頁,href設置為框架頁,target
設置為_parent,此種方法刷新整個框架</a>
</center>
</body>
</html>

=============== c.html =============

<html>
<body>
    這是C頁面
</body>
</html>

=============== d.html =============

<html>
<body>
    這是D頁面
</body>
</html>

=============== e.html =============

<html>
<body>
    這是E頁面
</body>
</html>

html框架的小實例