創作內容

1 GP

CSS Layout簡易教學 Vol. 1

作者:男人~好宅!│2008-06-05 12:36:23│巴幣:0│人氣:604
要做一個好的網頁框架,基本要顧慮到是〝日後維修方便〞、〝框架程式碼清楚簡易〞。
網頁框架通常分為兩欄式及三欄式。這次先用巴哈的小屋講解。
當然就厚臉皮的拿自己的小屋當範本囉~(羞)


點小圖就可以看原始圖喔

劃分區塊注意事項

1.盡量不使用表格合併,避免日後維修尋找區塊不易
2.以大表格包多個小表格來分割區塊


二欄式劃分法

第一步:

先判斷最外層框架是直列式或者是橫列式。
巴哈的網頁是直列式,由上而下劃分出三個區塊(紅線標示):
第一層區塊一:巴哈姆特抬頭
第一層區塊二:勇者小屋
第一層區塊三:主體內容跟右方廣告

第二步:

將第一層區塊三在劃分為兩個區塊(深紅線),這樣就完成兩欄式框架

備註:

海綠色區塊為內容部份,功能為大致相同的區塊
編排後的程式碼,將於下次出現
請耐心的等待(應該是沒人吧...)
引用網址:https://home.gamer.com.tw/TrackBack.php?sn=353474
All rights reserved. 版權所有,保留一切權利

相關創作

留言共 1 篇留言

藍月.青雨
有續集嗎?

06-06 22:48

男人~好宅!
續集...
我盡量生,最近在教新人,會順便整理出來 = =a06-09 20:26
我要留言提醒:您尚未登入,請先登入再留言

1喜歡★d1221ray 可決定是否刪除您的留言,請勿發表違反站規文字。

前一篇:簡單... 後一篇:CSS Layout簡易...

追蹤私訊切換新版閱覽

作品資料夾

yehyi87喜歡輕小說的人
《遊戲玩家的戀愛遊戲》更新了,想看日系輕小說的人,歡迎來我的小屋~看更多我要大聲說昨天23:36


face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準,可能無法使用新的應用程式來呈現網站內容,在瀏覽器支援度及網站安全性的雙重考量下,為了讓巴友們有更好的使用體驗,巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特:
。Google Chrome(推薦)
。Mozilla Firefox
。Microsoft Edge(Windows10以上的作業系統版本才可使用)

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營,請將 gamer.com.tw 加入廣告阻擋工具的白名單中,謝謝 !【教學】