a:link,a:visited { text-decoration: none; color: pink } a:hover { text-decoration: underline } .bold { font-weight: bold } .altbg1 { background: #303030; font: 12px Tahoma, Verdana; } .altbg2 { background: #393939; font: 12px Tahoma, Verdana; } blockquote { margin-left:10px; margin-right:5px; border:#000000 dashed 1px; padding:5px; background-color:#393939} //blockquote { margin-left:20px; margin-right:20px; border:#000000 dashed 1px; padding:5px; background-color:#393939} .code { margin-left:20px; margin-right:20px; padding:5px; background-color:#393939} .clsResult { margin: 0; padding: 2px; } .clsResultTitle { font-size: 16px; font-weight: normal; text-decoration: underline; line-height:25px; margi:2px 0; color: YELLOW} .clsResultTitleNoBold { font-size: 12px; font-weight: bold; text-decoration: underline; line-height:normal; margi:2px 0; color: YELLOW} .clsResultDescription { font-size: 12px; line-height:normal; color: } .clsURL { font-size: 12px; line-height:25px; color: RED; text-decoration: underline; } .clsCell { padding: 2px; background: ; border: 1px solid RED; cursor:pointer; cursor:hand } .clsResultTitle a:hover {color:#f00} .clsResultTitleNoBold a:hover {color:#f00}
游客:   注冊 | 登錄 | 權限 | 幫助 | 萬年曆 | 捐助論壇 | 購物車
各位注意：為方便管理，由即日起，所有做廣告者即時刪號，亂開主題及灌水者重扣分，絕不手軟，請自重。
數據正在加載中...
YY行動版 | YY是我家，努力靠大家。

 YyHero18Net 首頁 » ※【 大名素材Arts → ( 名 Art 妳你您祢袮囉 新版區 ) 】※  移到頁底
作者:
標題: [分享] 電腦版的網頁佈局div+iframe示範} 上一主題 | 下一主題
會員: yyhero18net
編號: 0000002
頭銜: 壇主
帳號: VIP永久會員
積分: 926070670
貢獻: 1032
發帖: 65535
注冊: 2005-4-27
狀態: 在線
性別: ( 男 Male )
贊助網站載入中...
#1 本貼發表於 2020-9-18 12:30 PM
標題: [分享] 電腦版的網頁佈局div+iframe示範

贊助網站載入中...

贊助網站載入中...
原圖

注意：演示效果會因各瀏覽器的支援情況而有所不同，貼內一切的演示效果以原圖為準，謝謝。

電腦版的網頁佈局div+iframe示範

演示：模擬屏幕 320 x 200，若x4=1280注意:黃框是主素材div 沒設width height100。
head.html 頁頂導航欄
L.html左側導航或精選推荐欄
R.html右側導航或精選推荐欄
index.html
主首貢內容
foot.html 頁底版權聲明



一般网页均以上中下区分 而左右栏就大多数会在购物或大型网站較常見
除非网页内容非常丰富 而且分类众多 否则一般网页很少会用上左右侧栏。
首先说为何需分开上中下 如果网站只有一页 当然不需这么烦 分开三页来写啦
但假如页数有10页 难道每页都写页顶和页底吗？
没错是可以複製页顶和页底的参数到每一页 但假如需要改动页顶或页底参数时 不就是十页都需改吗？
所以最好就是将页顶和页底分开写 然后嵌入到每一页 这样日后需要改动页顶页底各参数时 就较方便了。
如何将页顶页底嵌入 index.html 老实说 较理想的方法应像 www.yy18.info 一样 以PHP include 嵌入
但可惜PHP却在演示中失效呢 所以就改用 iframe 嵌入嘞
index.html 主首貢內容 是指每一頁的內容直接寫進這裡 例如index2.html index3.....................
head.html 頁頂導航欄 故名思議就是網頁的分類
foot.html 頁底一般用作網站的版權聲明
www.yy18.info就是以div+PHP include上中下佈局
無論按到哪頁 页顶页底維持不變 所變的是中間位置的內容
而且按來按去還在index?p= 就是利用PHP參數將每一頁的分類內容include到index
所以www.yy18.info的index.php
基本上只有
include ’head.php’;
include ’main.php’;
include ’foot.php’;

CODE:  [Copy to clipboard]
<div style="height:100;border: 3px solid yellow;">
  <div style="width:100%;border: 3px solid red;"><IFRAME FRAMEBORDER=0 MARGINWIDTH=0 MARGINHEIGHT=0 SCROLLING=NO WIDTH=100% HEIGHT=20 SRC="head.html"></IFRAME>
  </div>
   <div style="width:100%;height:50%;border: 3px solid orange;">
  <div style="float:left;width:50px;height:100%;border: 3px solid red;">
<IFRAME FRAMEBORDER=0 MARGINWIDTH=0 MARGINHEIGHT=0 SCROLLING=NO WIDTH=100% HEIGHT=100% SRC="left.html"></IFRAME></div>
  <div style="float:right;width:50px;height:100%;border: 3px solid red;">
<IFRAME FRAMEBORDER=0 MARGINWIDTH=0 MARGINHEIGHT=0 SCROLLING=NO WIDTH=100% HEIGHT=100% SRC="right.html"></IFRAME></div>
    <div style="float:center;height:100%;border: 3px solid red;">index.html<br>主首貢內容
  <div style="float:left;width:50px;border: 3px solid red;"><img src="../yyhero18net/images/icon/000.gif" border="0"></div>
  <div style="float:right;width:50px;border: 3px solid red;"><img src="../yyhero18net/images/icon/000.gif" border="0"></div>
  <div style="float:center;width:50px;border: 3px solid red;"><img src="../yyhero18net/images/icon/000.gif" border="0"></div>
    </div>
   </div>
  <div style="width:100%;border: 3px solid red;">
  <IFRAME FRAMEBORDER=0 MARGINWIDTH=0 MARGINHEIGHT=0 SCROLLING=NO WIDTH=100% HEIGHT=20 SRC="foot.html"></IFRAME>
  </div>
</div>

贊助網站載入中...
※ 所有言論不代表本站立場與本站立場無關，本站不對其內容負上任何責任。※
※ [注意公告] 已進行 統一發表主題的格式，謝謝合作！※
※ [注意公告] 原創貼的發貼要求，謝謝合作！※
2020-9-18 12:30 PM
資料 主頁 消息 本貼子捷徑 編輯帖子
會員: haifa9392
編號: 0431445
頭銜: 中級會員
帳號: 沒有 (查詢升級/捐款)
積分: 2102
貢獻: 0
發帖: 90
注冊: 2010-7-7
狀態: 离線
性別: ( 不男不女 (人妖) )

#2 本貼發表於 2021-2-20 11:23 PM


你一进入战备状态 加油特种兵

※ 請勿惡意灌水，本文為 haifa9392 個人意見，與本站立場無關！※
※ 本論壇壇規 (請各位管理人員&會員 進來看看) 謝謝！※
2021-2-20 11:23 PM
資料 消息 本貼子捷徑 編輯帖子
可打印版本 | 推荐給朋友 | 訂閱主題 | 收藏主題

論壇跳轉:  
贊助網站載入中...
[ 聯系我們 - YyHero18Net 歪歪英雄十八叻 主首頁 ] 將本站加入最愛 ∼ 將本站設為首頁 ∼ 清除Cookies
Powered by Discuz! 2.5 F SP1 © 2001-2005 Comsenz Technology Ltd.  移到頁頂
2016-2-14日起新增微信捐助本站
2020-8-2 Yy行動版，正式上線測試，有關Flash小遊戲/下載種子的問題詳情。
2016-2-14日起新增微信捐助本站
各位內地/香港/海外朋友：Donation