1. 程式人生 > >【HTML】使用框架導航跳轉到指定的節

【HTML】使用框架導航跳轉到指定的節

1、main檔案,兩個頁面

<html>

<frameset cols="20%,80%">
    <frame src="HTML框架-使用框架導航跳轉指定的節-content.html"></frame><br />
    <frame src="HTML框架-使用框架導航跳轉指定的節-link.html" name="showframe"></frame>
</frameset>

</html>

2、content檔案,包含兩個跳轉連結

<html>
<body>
    <a href="HTML框架-使用框架導航跳轉指定的節-link.html" target="showframe">沒有錨的連結</a><br />
    <a href="HTML框架-使用框架導航跳轉指定的節-link.html#C10" target="showframe">帶有錨的連結</a>
</body>
</html>

3、link檔案,包含頁面內容

<html>
<body>
<h2>第一章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第二章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第三章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第四章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第五章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第六章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第七章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第八章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第九章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2><a name="C10">第十章</a></h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第十一章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第十二章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第十三章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第十四章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第十五章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>

<h2>第十六章</h2>
<p>這是一個段落!!!!!!!!!!!!!!!!!!!!!!</p>
</body>
</html>

4、最後的結果。通過“帶有錨的連結”跳轉到“第十章”