html 框架允許在文檔窗口中創建多個文檔區域,用于組織網站內容。要創建框架,使用 標記指定行或列,并使用 標記指定每個框架的源。框架可以嵌套,使用 name 屬性命名框架以供 javascript 操作。不過,建議使用現代技術,例如靈活網格,而不是框架。
HTML 中框架的用法
在 HTML 中,框架指定了文檔窗口中可容納多個文檔的位置。框架通常用于將網站的不同部分組織成邏輯分區。
創建框架
要創建框架,使用 <frameset></frameset>
標記,并在其中指定框架的行或列:
<code class="html"><frameset rows="20%, 80%"> <frame src="header.html"> <frame src="content.html"> </frameset></code>
登錄后復制
上面的示例創建了一個兩行框架集,其中“header.html”占據頂部 20%,而“content.html”占據底部 80%。
嵌套框架
一個框架集可以嵌套在另一個框架集內,允許創建更復雜的分區。例如:
<code class="html"><frameset cols="50%, 50%"> <frameset rows="50%, 50%"> <frame src="menu.html"> <frame src="content1.html"> </frameset> <frame src="content2.html"> </frameset></code>
登錄后復制
這個示例創建了一個 50/50 列框架集,其中左側框架集包含一個 50/50 行框架集,用于“菜單”和“內容 1”,而右側框架集包含“內容 2”。
命名框架
為了引用框架并對其進行操作(例如更改源或刷新內容),可以使用 name
屬性來命名每個框架。例如:
<code class="html"><frame name="header" src="header.html"> <frame name="content" src="content.html"></code>
登錄后復制
JavaScript 中的框架操作
JavaScript 可以通過 window.frames
對象數組來訪問和操作框架。例如:
<code class="javascript">window.frames[0].location = "new_header.html"; //更改第一個框架的源 window.frames["content"].reload(); //刷新“content”框架</code>
登錄后復制
注意:框架已不再是 HTML 的推薦做法,因為它可能會導致可訪問性問題和復雜性。現代網站設計應該使用更現代的技術,例如靈活的網格和響應式布局。