整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
本例演示：如何使用 <noframes> 標簽。
<html> <frameset cols="25%,25%,25%"> <frame src="/example/html/frame_a.html"> <frame src="/example/html/frame_b.html"> <frame src="/example/html/frame_c.html"> <noframes> <body>您的瀏覽器無法處理框架！</body> </noframes> </frameset> </html>
HTML基礎教程：框架實例大合集
本例演示如何制作含有三份文檔的框架結構，同時將他們混合置于行和列之中。
<html> <frameset rows="50%,50%"> <frame src="/example/html/frame_a.html"> <frameset cols="25%,75%"> <frame src="/example/html/frame_b.html"> <frame src="/example/html/frame_c.html"> </frameset> </frameset> </html>
HTML基礎教程：框架實例大合集
本例演示 noresize 屬性。在本例中，框架是不可調整尺寸的。在框架間的邊框上拖動鼠標，你會發現邊框是無法移動的。
<html> <frameset cols="50%,*,25%"> <frame src="/example/html/frame_a.html" noresize="noresize" /> <frame src="/example/html/frame_b.html" /> <frame src="/example/html/frame_c.html" /> </frameset> </html>
HTML基礎教程：框架實例大合集
本例演示如何制作導航框架。導航框架包含一個將第二個框架作為目標的鏈接列表。名為 "contents.htm" 的文件包含三個鏈接。
<html> <frameset cols="120,*"> <frame src="/example/html/html_contents.html" > <frame src="/example/html/frame_a.html" name="showframe"> </frameset> </html>
HTML基礎教程：框架實例大合集
HTML基礎教程：框架實例大合集
HTML基礎教程：框架實例大合集
本例演示如何創建內聯框架（HTML 頁中的框架）。
<html> <body> <iframe wigth="200" height="100" src="/i/eg_landscape.jpg"></iframe> <p>一些老的瀏覽器不支持 iframe。</p> <p>如果得不到支持，iframe 是不可見的。</p> </body> </html>
HTML基礎教程：框架實例大合集
本例演示兩個框架。其中的一個框架設置了指向另一個文件內指定的節的鏈接。這個"link.htm"文件內指定的節使用 <a name="C9"> 進行標識。
<html> <frameset cols="20%,80%"> <frame src="/example/html/frame_a.html"> <frame src="/example/html/link.html#C9"> </frameset> </html>
HTML基礎教程：框架實例大合集
本例演示兩個框架。左側的導航框架包含了一個鏈接列表，這些鏈接將第二個框架作為目標。第二個框架顯示被鏈接的文檔。導航框架其中的鏈接指向目標文件中指定的節。
<html> <frameset cols="200,*"> <frame src="/example/html/content.html"> <frame src="/example/html/link.html" name="showframe"> </frameset> </html>
HTML基礎教程：框架實例大合集
HTML基礎教程：框架實例大合集
希望以上可以解決你們心中的一些疑惑，其中可能會有不對的地方或是需要改進的地方，歡迎留言糾正。感覺還不錯歡迎關注收藏轉載哦
過 HTML DOM，您能夠使用節點關系在節點樹中導航。
HTML DOM 節點列表
getElementsByTagName() 方法返回節點列表。節點列表是一個節點數組。
下面的代碼選取文檔中的所有 <p> 節點：
實例
varx=document.getElementsByTagName("p");
可以通過下標號訪問這些節點。如需訪問第二個 <p>，您可以這么寫：
y=x[1];
嘗試一下 ?
注意：
下標號從 0 開始。
HTML DOM 節點列表長度
length 屬性定義節點列表中節點的數量。
您可以使用 length 屬性來循環節點列表：
實例
x=document.getElementsByTagName("p");for(i=0;i<x.length;i++){document.write(x[i].innerHTML); document.write("<br>");}
實例解析：
獲取所有 <p> 元素節點
輸出每個 <p> 元素的文本節點的值
導航節點關系
您能夠使用三個節點屬性：parentNode、firstChild 以及 lastChild ，在文檔結構中進行導航。
請看下面的 HTML 片段：
<html><head><metacharset="utf-8"></head><body><p>Hello World!</p><div><p>DOM 是非常有用的!</p><p>這個實例演示了節點的關系。</p></div></body></html>
首個 <p> 元素是 <body> 元素的首個子元素（firstChild）
<div> 元素是 <body> 元素的最后一個子元素（lastChild）
<body> 元素是首個 <p> 元素和 <div> 元素的父節點（parentNode）
firstChild 屬性可用于訪問元素的文本：
實例
<pid="intro">Hello World!</p><script>x=document.getElementById("intro");document.write(x.firstChild.nodeValue);</script>
嘗試一下 ?
DOM 根節點
這里有兩個特殊的屬性，可以訪問全部文檔：
document.documentElement - 全部文檔
document.body - 文檔的主體
實例
<p>Hello World!</p><div><p>DOM 是非常有用的!</p><p>這個實例演示了 <b>document.body</b> 屬性。</p></div><script>alert(document.body.innerHTML);</script>
嘗試一下 ?
childNodes 和 nodeValue
除了 innerHTML 屬性，您也可以使用 childNodes 和 nodeValue 屬性來獲取元素的內容。
下面的代碼獲取 id="intro" 的 <p> 元素的值：
實例
<pid="intro">Hello World!</p><script>txt=document.getElementById("intro").childNodes[0].nodeValue;document.write(txt);</script>
嘗試一下 ?
在上面的例子中，getElementById 是一個方法，而 childNodes 和 nodeValue 是屬性。
案例和由此案例重點講解的知識點介紹
案例代碼實現
行內標簽知識點詳解
此案例是頁面，效果如下：
此頁面的技術實現解析：
所有元素在統一行顯示的時候，需要使用到行內標簽img 和 a來實現
此案例中主要用到了，基于此，我們會系統的將如下知識點全部講解：
行內標簽
第一步：書寫導航條的html代碼
第二步：定義導航的css樣式
行內元素
-行內元素：
在html中<a>、<span>、<br>、<i>、<em>、<strong>、<label>等等屬于行內元素
-行內元素三大特點：
1、和其他元素都在一行上；
2、元素的高度、寬度、行高及頂部和底部邊距不可設置；
3、元素的寬度就是它包含的文字或圖片的寬度，不可改變（廢話）。
案例：
a{
background-color: PowderBlue;
width: 500px;
height: 300px;
//元素的高度、寬度、行高及頂部和底部邊距不可設置
}
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
