整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
rame 的最主要功能是用來把一個頁面劃分成好幾個小窗口頁面，每個小窗口可以顯示不同html文件，這樣頁面也可以稱為框架結構頁面，每個月小窗口稱作框架窗口，下來將詳細介紹框架窗口。
frame 在現在已經很少使用，雖然不是必須學習的，但還是建議了解學習下frame 、iframe的知識，在某些時候非常有用。
如果想將頁面分成上下兩部分，各自互相獨立又互相關聯，用戶在其中一個部分操作頁面不影響其它部分的頁面，這樣的頁面也叫多窗口頁面。
1、框架窗口基本結構：
框架窗口主要包含2部分，一個是框架集，一個是具體的框架文件。
框架集就是存放框架結構的文件，也是訪問框架文件的入口，如果網頁由上下2個框架窗口組成，那么除了這2個窗口的html文件，還有一個總的框架集文件。
框架文件是每個顯示區域對應的html文件，如下示例：
index.html
<html>
<head>
<title>框架頁面</title>
</head>
<body>
<frameset>
<frame src="top.html"></frame>
<frame src="bottom.html"></frame>
</frameset>
</body>
</html>如上index.html 就是框架集文件，在這個框架集文件中定義了頁面劃分成上下2部分，分別對應top.html 和 bottom.html 2個框架窗口文件。
2、框架窗口分割
框架頁面分割方式是在框架集frameset通過rows 或 cols 屬性定義的，一般按分割類型分為以下幾種：
2.1 水平分割窗口
將頁面按水平方向分割，也就是上下結構，語法：
<frameset rows="窗口1高度，窗口2高度，">
<frame src="top.html"></frame>
<frame src="bottom.html"></frame>
</frameset>在該語法中，rows 可以設置多個值，每個值對應一個框架窗口垂直高度，它的值可以使用像素單位或百分比單位。
如下示例：
<html>
<frameset rows="25%,50%,25%">
<frame src="/example/html/frame_a.html">
<frame src="/example/html/frame_b.html">
<frame src="/example/html/frame_c.html">
</frameset>
</html>顯示效果：
比如上面這個，被從上到下分割成3個窗口，高度依次是25%,50%,25%。
2.2 垂直分割窗口
沿著頁面垂直方向分割，也就是左右結構的多窗口頁面。語法如下：
<frameset cols="窗口1寬度，窗口2寬度，">
<frame src="left.html"></frame>
<frame src="right.html"></frame>
</frameset>在該語法中，cols 可以設置多個值，每個值對應一個框架窗口水平寬度，它的值可以使用像素單位或百分比單位。
示例：
<html>
<frameset cols="25%,50%,25%">
<frame src="/example/html/frame_a.html">
<frame src="/example/html/frame_b.html">
<frame src="/example/html/frame_c.html">
</frameset>
</html>顯示效果：
比如上面這個，被從左到右分割成3個窗口，寬度依次是25%,50%,25%。
2.3、嵌套分割窗口
嵌套窗口就是在一個頁面既有水平分割又有垂直分割的窗口，如下示例：
先水平分割再垂直分割
<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>顯示效果：
先垂直分割再水平分割
<frameset cols="50%,50%">
<frame src="/example/html/frame_a.html">
<frameset rows="25%,75%">
<frame src="/example/html/frame_b.html">
<frame src="/example/html/frame_c.html">
</frameset>
</frameset>顯示效果：
理論上可以無限嵌套，是不是很好玩。
2.4、noframes
當瀏覽器布置frame 時會顯示noframes 中的內容。如下代碼：
<html>
<frameset rows="50%,50%" frameborder="1" framespacing="100" bordercolor="blue">
<frame src="/example/html/frame_a.html">
<frameset cols="25%,75%" frameborder="0" bordercolor="orange">
<frame src="/example/html/frame_b.html">
<frame src="/example/html/frame_c.html">
</frameset>
</frameset>
</html>效果顯示：
1、設置邊框 —— frameborder
frameborder 等于0時不顯示邊框，默認顯示。
2、邊框寬度 —— framespacing
在html5中無效。
3、邊框顏色 —— bordercolor
如下代碼：
<html>
<frameset rows="50%,50%" frameborder="1" framespacing="100" bordercolor="blue">
<frame src="/example/html/frame_a.html">
<frameset cols="25%,75%" frameborder="0" bordercolor="orange">
<frame src="/example/html/frame_b.html">
<frame src="/example/html/frame_c.html">
</frameset>
</frameset>
</html>效果：
具體可以參考這里 https://www.cnblogs.com/lavenderzh/archive/2012/04/09/2438803.html 查看這幾個屬性的關系。
1、頁面源文件 —— src
就是每個框架窗口對應的html文件，這里可以是圖片或其它文件。
<frame src="文件地址">2、頁面名稱 —— name
給每個框架窗口設置名稱，有助于鏈接或查找窗口。
<frame src="文件地址" name="頁面名稱">3、禁止調整窗口尺寸 —— noresize
黨員鼠標拖到框架邊框時，會發現鼠標形狀變成可拖動的，可以改不框架窗口寬度或高度。如果不希望改變窗口寬度或高度，可以使用noresize 屬性。
如下示例：
<html>
<frameset cols="25%,50%,25%">
<frame noresize="noresize" src="/example/html/frame_a.html">
<frame src="/example/html/frame_b.html">
<frame src="/example/html/frame_c.html">
</frameset>
</html>窗口a是不可改變寬度的。
浮動框架是一種特殊的框架，它是在主窗口中嵌套一個子窗口，也就是整個頁面不是框架頁面，但卻包含了一個框架窗口。
示例：
<iframe name="名稱" src="https://www.w3school.com.cn/" width="800px" height="600px"></iframe>效果如下：
1、浮動框架邊框 —— frameborder
frameborder 屬性規定是否顯示 iframe 周圍的邊框。設置屬性值為 "0" 就可以移除邊框：
<iframe src="demo_iframe.htm" frameborder="0"></iframe>顯示效果：
2、鏈接到框架頁面
通過 a 標簽的 target 屬性可以跳轉到框架頁面，示例如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(runoob.com)</title>
</head>
<body>
<iframe src="http://www.runoob.com/" name="iframe_a"></iframe>
<p><a href="https://mp.toutiao.com/" target="iframe_a">頭條號</a></p>
<p><a href="http://www.runoob.com/" target="iframe_a">菜鳥教程</a></p>
</body>
</html>顯示效果如下，點擊下面2個鏈接，切換窗口。
frame 和 iframe 浮動框架用途很廣，比如可以實現頁面局部刷新，在之前被廣泛使用，但是現在基本不建議使用，它有很多問題，比如安全性，性能方面等。
當然有時也會使用iframe，比如打印pdf，下載文件等等。
上篇：前端入門——html 表單控件使用
除的元素
1、能用css代替的元素
basefont、big、center、font、s、strike、tt、u。這些元素純粹是為畫面展示服務的，HTML5中提倡把畫面展示性功能放在css中統一編輯。
2、不再使用frame框架。
frameset、frame、noframes。HTML5中不支持frame框架，只支持iframe框架，或者用服務器方創建的由多個頁面組成的符合頁面的形式，
刪除以上這三個標簽。
3、只有部分瀏覽器支持的元素
applet、bgsound、blink、marquee等標簽。
4、其他被廢除的元素
廢除rb, 使用ruby替代。
廢除acronym使用abbr替代。
廢除dir使用ul替代。
廢除isindex使用form與input相結合的方式替代
廢除listing使用pre替代
廢除xmp使用code替代
廢除nextid使用guids
廢除plaintex使用“text/plian”（無格式正文）MIME類型替代。
TML5從入門到精通，兄弟連京修隨堂筆記（一）HTML的框架結構，每日都有新內容，訂閱走一波
一個瀏覽器窗體可以通過幾個頁面的組合來顯示。我們可以使用框架來完成(frames)這項工作。(框架可以把HTML文檔分為多個頁面)。也就是將一個瀏覽器文檔窗口分隔成多個窗口，每個窗口都可以顯示一個獨立的網頁文件。
框架頁使用了表格的方式組合，可以分為數行與數列。
框架的優點
重載頁面時不需要重載整個頁面，只需要重載頁面中的一個框架頁(減少了數據的傳輸，增加了網頁下載速度)。
方便制作導航欄。
框架的缺點
會產生很多頁面，不容易管理。
不容易打印。
瀏覽器的后退按鈕無效。
代碼復雜,無法被一些搜索引擎索引到。
多數小型的移動設備（PDA 手機）無法完全顯示框架。
多框架的頁面會增加服務器的http請求。
由于上面諸多缺點，因此不符合標準網頁設計的理念.已被標準網頁設計拋棄
HTML框架標簽
<frameset>標簽 -- 代替body標簽定義了框架頁,并且定義了框架將分為多少行與多少列。常用屬性如下:
cols -- 定義了框架含有多少列與列的大小(每個值使用逗號分隔),取值為象素px或者百分比%
rows -- 定義了框架含有多少行與行的大小(每個值使用逗號分隔),取值為象素px或者百分比%
border -- 定義frame定義的框架頁的邊框(單位像素),使用css實現
frameborder -- 定義框架頁是否邊框(此屬性應寫在frame標簽內部,不應在此出現)
framespacing -- 定義框架頁之間間隔的距離,使用css實現
<noframes>標簽
可為那些不支持框架的瀏覽器顯示文本，和<body>組合使用
<iframe>標簽
創建一個包含另外一個文檔的內聯框架，iframe標簽內的內容可以做為瀏覽器不支持iframe標簽時顯示 。
frame標簽 -- 定義frameset標簽中每個框架頁的內容
frame標簽是單獨出現的，<frame />
常用屬性:
frameborder -- 定義了內容頁的邊框,取值為(1|0),缺省值為1
1 -- 在每個頁面之間都顯示邊框
0 -- 不顯示邊框
name -- 在一個框架頁鏈接到另一框架頁時使用(另一個框架頁可以使用target定義鏈接頁)
noresize -- 定義了瀏覽者是否可以通過拖拽改變框架頁尺寸,取值為(noresize)
scrolling -- 定義是否有滾動條,取值為(yes|no|auto),缺省值為auto
yes -- 顯示滾動條
no -- 不顯示滾動條
auto -- 當需要時再顯示滾動條
src -- 定義了內容頁URL
border – 設置邊框粗細
HTML框架示例
<html> <!-- 網頁開始標記 -->
<head>
<title>使用框架定義后臺管理平臺模型</title>
</head> <!-- 設置網頁標題 -->
<frameset rows="80,*" frameborder="1" border="5"> <!-- 劃分兩行 -->
<frame src="top.html" name="top" scrolling="no" noresize/> <!-- 頂部大類窗體 -->
<frameset cols="200, *"> <!-- 劃分左右兩列 -->
<frame src="menu.html" name="menu" scrolling="no" noresize/>
<!-- 左邊菜單窗體 -->
<frame src="main.html" name="main" noresize />
<!-- 右邊內容窗體 -->
</frameset> <!-- 內層框架結束 -->
<noframes>
<body><p>您的瀏覽器不支持框架，請升級瀏覽器</p></body>
</noframes>
</frameset> <!-- 外層框架結束 -->
</html>
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
