[討論] 關於相同代碼在同一頁面出現兩三次...

作者: mauve (mauve是淡紫色)   2018-09-22 21:30:55
最近在寫一個可以放自己寫的程式的網站
而且是基於WordPress的
不過因為是第一次接觸RWD網頁設計
因此花了好一大把時間進度卻很慢
其中在做手機端與電腦端Navigation Bar的適配時
發現當為了達到某些功能
有些代碼需要重複寫進去同一個頁面才能達到
像是一個選單在不同裝置想呈現不同效果
我就在同一個頁面加入了3次取得選單html的php代碼
這是我網頁上呈現Navigation Bar的三種形式:
Desktop-Original:
http://i.imgur.com/sxQmLh8.jpg
Scroll to Fixed:
http://i.imgur.com/SDw7orw.jpg
Mobile:
http://i.imgur.com/PJAspq6.jpg
最後附上因為走投無路而勉強寫進的三個相同的代碼:
http://i.imgur.com/XHjoIb6.jpg
想請問一下各位高手
做成這樣還算是一個好的rwd網頁嗎?
還是這一切都是因為自己經驗不足或是太笨?
作者: mauve (mauve是淡紫色)   2018-09-22 21:55:00
作者: torali (pandaemon)   2018-09-22 22:48:00
看起來寫一個就夠,如果是我會用position和flex排版,然後在media query去操作這兩個屬性變成你要的樣子
作者: jhnny97 (≡(  ゚Д゚))   2018-09-23 08:22:00
在最頂端放一個空的元素卡位scroll就順了(?
作者: ymcheung (ymc)   2018-09-23 09:26:00
確實也是有 flexbox order 搞不定的時候如果網站規模很大,我會請後端幫忙判斷 device 各自出
作者: jherk   2018-09-23 13:18:00
用js操作class, class寫css media控制rwd顯示/隱藏
作者: yzfr6 (扮關二哥!)   2018-09-24 16:09:00
程式碼
作者: jake255121 (微花猴傑)   2018-09-25 15:30:00
我只好奇你的文章怎麼會這麼異國風情

Links booklink

Contact Us: admin [ a t ] ucptt.com