Html中框架的使用
1.框架頁面
幾個重要的概念:框架集和框架。
我們先了解一下上面的概念。
框架集是若干框架的集合,利用框架集可以定義框架結構,實現分割瀏覽器窗口的功能。
框架集用<frameset></frameset>來表示
框架:每個框架就是一個區域,所有的框架組合成了框架集
框架用<frame></frame>來表示
了解了基本概念之后,有幾點是我們需要知道和注意的
a.標記<frameset>可以嵌套使用。
b.frameset的cols和rows屬性:
cols用于設定分割左右窗口的高度,各數值之間用“,”隔開,也可設為瀏覽器窗口尺寸的百分比%,“*”表示剩余部分。
rows用于設定分割上下窗口的高度。其設置方法和cols類似。
c.框架集文件是一個特殊的HTML文件,它的body部分可以是空的。
接下來就看個例子。
主界面:
<!doctype html> <html><head><meta charset='utf-8'><title>框架的使用</title></head><frameset rows='200px,200px,*'> /*將整個頁面分為上下三個部分,第一部分高200px,第二部分高200px,第三部分為剩下的高度*/<frame src='sj03-1.html' name='frame1'><frame src='sj03-3.html' name='frame2'><frame src='sj03-5.html' name='frame3'></frameset> </html>
第一個框架載入“sj03-1.html”的網頁。
第二個框架載入“sj03-3.html”的網頁
等等,依此類推。
’注意:這里的src引用的是相對地址
我們可以通過實現"sj03-1.html"來展現更多的功能。
sj03-1.html實現:
<!doctype html> <html> <head><meta charset='utf-8'><title>超鏈接</title> </head> <body><p><a href="https://www.baidu.com" target='frame3'>點擊彈出百度</a></p><p><a href="https://www.zhihu/explore" target='frame3'>點擊彈出知乎</a></p> </body> </html> 通過target屬性,可以讓我們點擊“點擊彈出百度”和“點擊彈出知乎”時,讓百度和知乎的頁面在第三個框架內顯示。2.頁內框架的使用
頁內框架和頁面框架的區別就是,頁內框架愛是普通頁面中的一個特殊區域,即普通頁面中混雜著若干個框架,通常為表格的單元格;
而頁面框架則是整個頁面就是一個框架。
將表格的某個單元格定義為頁內框架的方法如下:
<td> <iFrame src=? name=? width=? height=?/> </td>
src指定預載頁面內容,name給頁內框架命名,方便自定義的鏈接指向該框架。
我們還是來看個例子。
<!doctype html> <html><head><meta charset='utf-8'><title>實驗四——頁內框架制作</title></head><body><table border='1' bordercolor='red'><tr><td colspan='2' align='center'>白居易</td></tr><tr> <td align='center' valign='center'><a href="01.html" target='123'> 彈出1</a><p><a href="02.html" target='123'>彈出2</a> </td><td><iframe src="03.html" name='123'></iframe> </td></tr></table></body> </html>
相信看了上面的例子后,這個例子也就很好理解。
首先name為‘123’的框架會先載入‘03.html’這個頁面;
當我們點擊‘彈出1’后,會在name為‘123’的框架內顯示‘01.html’這個頁面
當我們點擊‘彈出2’后,會在name為‘123’的框架內顯示‘02.html’這個頁面
總結
以上是生活随笔為你收集整理的Html中框架的使用的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: BeautifulSoup中的.text
- 下一篇: script到底应该放在哪里